jquery - jQuery UI 自动完成与类似 Chrome 的自动填充

Question

我正在使用 jQuery UI 自动完成功能，虽然我找到了实现自动填充功能的方法，但我一直在寻找类似 Google Chrome 地址栏中的功能。其中最匹配的项目会自动填充，但不会中断您的输入。

任何帮助表示赞赏。

Answer 1

我建议您查看较旧的 jQuery 自动完成插件，它内置了此选项。语法类似，但不是将源作为选项，而是将其初始化为第一个参数，语法如下：

$('input.autocomplete').autocomplete(data, {autoFill: true});

必须是结果data数组或指向生成它的服务器端脚本的 url。有关更多信息，请参阅其文档：http ://docs.jquery.com/Plugins/Autocomplete

---

但是请注意，这个插件的作者认为它已经过时，而 jQuery UI 自动完成是它的继任者。在“如何迁移”帖子中，他现在向用户指出，没有该autofill选项的理性 jQuery UI 进行了解释：

自动填充：没有立即可用的替换，原因很充分：通过键盘选择项目时的默认行为现在将焦点值放入输入中，就像 Firefox Awesomebar 一样。它与 autoFill 选项所做的不同，但应该不需要重新创建该效果。

Answer 2

$('#FELD').autocomplete( 
      source: "ajax/manager.json.php",
      minLength: 0, 
      change: function(event, ui) {
          found = false;
            $(".ui-autocomplete li").each(function(n, element){
              var retval = $(element).text().toUpperCase();
              var retval2 = $($(this).data()).attr('item.autocomplete');
              if ((found == false ) &&(retval == $("#FELD").val().toUpperCase()) )
              {
                $("#FELD").val(retval);
                $("#FELDID").val(retval2.id);
                found = true;
              }
            });
          if ( found == false) { $("#FELDID").val("-1"); }
      }
  }); `enter code here`