jQuery UI自动完成：从列表中强制执行选择而不进行任何修改 [英] jQuery UI autocomplete: enforce selection from list without modifications

问题描述

我正在使用使用Knockout JS模板/ JQuery自动完成组合框

我需要强制用户必须在自动完成列表中选择一个值并在之后他们选择的值不能向select中添加其他文本。我搜索过，但找不到如何防止输入其他文本的示例。它必须保持可编辑状态，只要他们选择了错误的下拉菜单，但他们输入的内容必须与列表中的值匹配100％。

I need to enforce that the user must select a value in the autocomplete list and after they select the value to not be able to add additional text to the select. I have searched but I cannot find an example of how to prevent additional text from being entered. It must stay editable incase they selected the wrong drop down but what they type must match 100% with a value from the list.

我发现这个发布在jquery上，但它已经9个月了，没有人发布答案。

I found this posting on jquery but its 9 months old and no one posted an answer.

推荐答案

没有内置函数来做你想做的事。

There is no built in function to do what you want.

我做了一个简单的项目，使用自动完成 更改 事件您必须从自动填充中选择值，否则删除该值。

I made a simple project where using the autocomplete change event you must select the value from the autocomplete, if not the value is deleted.

更改活动

当字段模糊时触发，如果值已更改。

Triggered when the field is blurred, if the value has changed.

选择后，该字段被禁用，您可以使用激活锚点（例如）激活它。

After the selection the field became disabled, and you can activate it using an activating anchor (for example).

代码：

$("#artist").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "http://en.wikipedia.org/w/api.php",
            dataType: "jsonp",
            data: {
                'action': "opensearch",
                    'format': "json",
                    'search': request.term
            },
            success: function (data) {
                response(data[1]);
            }
        });
    },
    change: function (event, ui) {
        if (ui.item == null || ui.item == undefined) {
            $("#artist").val("");
            $("#artist").attr("disabled", false);
        } else {
            $("#artist").attr("disabled", true);
        }
    }
});

$('#changeArtist').click(function (e) {
    e.preventDefault();
    $("#artist").attr("disabled", false);
});

这是一个小提琴： http://jsfiddle.net/IrvinDominin/nH4Nx/

这篇关于jQuery UI自动完成：从列表中强制执行选择而不进行任何修改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！