jQuery自动完成:如何禁用自由文本，并显示一个错误，从列表中的项目必须被选中

jQuery Autocomplete: How to disallow free text, and display an error that an item from the list must be selected?

本文关键字：列表 错误 一个 项目 何禁用 显示 jQuery 文本 自由      更新时间：2023-09-26

我知道javascript足够危险，我一直在阅读自动完成小部件的文档，但找不到任何关于该主题的内容。

旧版本的小部件确实有一个名为:mustMatch的选项，但我在新版本中没有看到任何选项。

我至少想出了如何在自动完成开始之前强制输入至少两个字符。为此，我添加了这一行:$("#user-city")。我有一种感觉，这可以折叠到下面的代码，但我不知道如何。

无论如何，是否有一种方法可以强制complete只接受列表中的值?然后可能显示div "你必须从列表中选择一个值" 如果他们继续输入一些自由文本?然后，如果他们只是取消选择框，它会删除他们输入的任何内容，因为它不匹配任何内容。

$(function() {
        var names = [ "Boston", "New York", "New Jersey", "Kansas City", "Los Angeles" ];
        var accentMap = {
            "á": "a",
            "ö": "o"
        };
        var normalize = function( term ) {
            var ret = "";
            for ( var i = 0; i < term.length; i++ ) {
                ret += accentMap[ term.charAt(i) ] || term.charAt(i);
            }
            return ret;
        };
        $( "#user-city" ).autocomplete({ minLength: 2});
        $( "#user-city" ).autocomplete({
            source: function( request, response ) {
                var matcher = new RegExp( $.ui.autocomplete.escapeRegex( request.term ), "i" );
                response( $.grep( names, function( value ) {
                    value = value.label || value.value || value;
                    return matcher.test( value ) || matcher.test( normalize( value ) );
                }) );
            }
        });
    });

这是jsfiddle: http://jsfiddle.net/HKzL7/

谢谢你的帮助!

我认为您可以使用change事件，并可以检查ui.item是否为空，然后您可以使输入为空并显示警报或自定义消息，例如(只是一个想法)

change: function( event, ui ) {
    if(ui.item==null) 
    {
        this.value='';
        alert('Please select a value from the list'); // or a custom message
    }
}

。

Update: change事件触发当字段被模糊，如果值已经改变。

相关文章：