Question

我在我自己的项目中通过jQuery UI尝试这个Demo，并找到了一个必要的修改。见下面的演示：

http://jqueryui.com/demos/autocomplete/#custom-data

在这个例子中，当我们输入“j”并选择任何一个选项时，它会获取一些与之相关的文本和徽标。哪个工作正常。在这里，假设我们从给出的自动建议中选择“jQuery”。它将在左侧加载文本和jQuery徽标。但是假设在执行此操作后，如果我们从文本框中删除单词“jQuery”，那么它应该重置并显示空白输出。但它仍然是先前加载的相同文本和徽标。

一般来说，我想要做的是，用户必须从自动提示中选择一些内容，而不是写出任何不在自动建议中的内容。

我们怎么能这样做？

提前致谢。

Answer 1

您可以覆盖select和change事件来实现此目的：

 $(".combobox").autocomplete({
    minLength: 0,
    source: function (request, respond) {
        //some source
    },
    change: function (event, ui) {
        //if no value inside the LI, reset the input -> uses a custom selector
        if ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0) {
            $(this).val('');
    },
    select: function (event, ui) {
        $(this).val(ui.item.Name);
    }
 );

您只需要一个自定义选择器来比较文本输入：

$.expr[':'].textEquals = function (a, i, m) {
    return $(a).text().match("^" + m[3] + "$");
};

jQuery UI自动完成：自定义数据提取问题

1 个答案: