Question

我对jQuery UI自动完成有一个奇怪的问题。我想要它，以便当文本字段获得焦点时，会出现自动完成中所有选项的列表。这样做有效，但是当通过点击选择项目时，建议会保持打开状态。我希望建议列表消失，就像自动完成通常有效一样。

使用键盘选择项目时效果很好，但当您点击项目时，列表会一次又一次地重新出现。

为了解决这个问题，只需手动传递值，该功能就可以正常工作。它只在我传入JSON源时才开始发生。

任何想法！？

工作代码 - http://jsbin.com/aFeceTe/1/edit?html,js,output

$(document).ready(function(){

   var test = [ { value: "1",label: "Google" }, { value: "2", label:"StackOverflow" }, { value: "3", label:"Microsoft" }, { value: "4", label:"Yahoo" } ];

   $("input").autocomplete({
     source: test,
     delay: 0,
     minLength: 0,
     select: function(event, ui) {      
        event.preventDefault();
        $(this).val(ui.item.label).attr('title', ui.item.label);
     }
  }).focus(function () {
      $(this).val('').autocomplete("search");
  });

});

代码破碎 - http://jsbin.com/uyOGUVU/6/edit?html,js,output

$(document).ready(function(){

   $("input").autocomplete({
      source: 'http://jsbin.com/IdIXIRU/3/js',
      delay: 0,
      minLength: 0,
      select: function(event, ui) {      
         event.preventDefault();
         $(this).val(ui.item.label).attr('title', ui.item.label);   
      }
   }).focus(function () {
      $(this).val('').autocomplete("search");
   });

});

Answer 1

试试这个

 $(document).ready(function(){
    var temp = true;
    $("input").autocomplete({
        source: 'http://jsbin.com/IdIXIRU/3/js',
        delay: 0,
    minLength: 0,
        select: function(event, ui) {
            event.preventDefault();
            $(this).val(ui.item.label).attr('title', ui.item.label);
            temp = true;
            return false;            
        }
  }).focus(function () {
       if(temp) {
         $(this).autocomplete("search");
         temp = false;
     }
   });
});

见DEMO

jQuery UI自动完成建议未关闭选择

1 个答案: