JQuery UI 自动完成 - 按 Enter 键后隐藏列表

Question

我有一个输入。我使用 Jquery UI 自动完成功能向用户提出建议。假设我的列表中有 3 个项目:item1、item2、item3。我正在寻找的是当用户按回车键时要关闭的列表。例如，如果用户仅输入“it”，则将显示所有 3 个元素。在这种情况下，如果他按回车键，我希望关闭该列表。我无法想出解决方案。希望有人能帮忙。干杯。马克。

http://jsfiddle.net/vXMDR/

我的html:

<input id="search" type="input" />​

我的js:

$(function() {

    var availableTags = [
            "item1","item2","item3"
        ];

    $("#search").autocomplete({
        source:availableTags,
        minLength: 0
        });
});​

Answer 1

解决方案如下:http://jsfiddle.net/vXMDR/3/

如果您有疑问，请告诉我。

神奇之处在于将自动完成关闭方法绑定(bind)到按键

 $("#search").keypress(function(e){ 
    if (!e) e = window.event;   
    if (e.keyCode == '13'){
      $('#search').autocomplete('close');
      return false;
    }
  });

更新

$("#search").keypress(function(e){ 将 #search 元素的按键绑定(bind)到指定的函数，并传入 event 对象。您也可以将其写为 $("#search").on('keypress', function(e) {...

if (!e) e = window.event; 确保如果未传入有效事件，则将 e 设置为当前 window.event 对象。

最后，if (e.keyCode == '13'){ 测试事件键码值是否等于“enter”键。有关有效键码的列表，see here .

这是自动完成关闭方法的文档 - http://docs.jquery.com/UI/Autocomplete#method-close