JQuery 自动完成 - 强制选择

JQuery Autocomplete - Force choice

本文关键字：选择 JQuery      更新时间：2023-09-26

我有一个使用JQuery自动完成的表单，它运行得很好。现在我需要另一个元素来强制用户在自动完成输入中选择有效选项。可以键入他们想要的任何内容，并且所有内容都通过自动完成进行过滤。但是他们必须从服务列表中选择一些东西。否则，输入字段必须被清空。尝试了一些更改方法，然后选择无济于事。这是我的自动完成代码。我看到了一些使用数据而不是源进行操作的示例。这似乎有很大的不同

$(function () {
    $("#sp_name").autocomplete({
        minLength: 2,
        delay: 300,
        source: function (request, response) {
            $.ajax({
                url: "./Search/",
                dataType: "json",
                data: {
                    term: request.term,
                    zoekterm: $("#al").html()
                },
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            label: item.naam,
                            value: item.naam
                        }
                    }));
                }
            });
        }
    })
});

试试这个：

我在这里使用本地列表，但您也可以通过 json 数据源实现这一点。只需添加一个更改事件。唯一的问题是，如果用户不点击建议，它将变为空白（即使用户输入与建议相同的文本）。用户必须单击该建议。

var list = ["c", "c++", "c#","Basic","Mongo"];
$('#auto').autocomplete({
source: list,
select: function (event, ui) {
    $(this).val(ui.item ? ui.item : " ");},
change: function (event, ui) {
    if (!ui.item) {
        this.value = '';}
//else { Return your label here }
}
});

JsFidle为它：http://jsfiddle.net/sarcastic/7KdZP/112/

In your case, Change function would be something like this:
change: function (event, ui)
{
if (!ui.label) { this.value = ''; }
}
相关文章：