jQuery用户界面自动完成只弹出用的minLength：0

Question

我使用的“自定义数据和显示”在http://jqueryui.com/demos/autocomplete/示例和简化了一点，所以我可以具有值和ID的，像这样：

$(function() { 
    var prd = [ 
     { s: "hallo", v: "1" }, 
     { s: "hey", v: "2" }, 
     { s: "alloh", v: "3" } 
    ]; 
    $("#product").autocomplete({ 
     source: prd, 
     minLength: 0, 
     focus: function(event, ui) { 
      $("#product").val(ui.item.s); 
      return false; 
     }, 
     select: function(event, ui) { 
      $("#product").val(ui.item.s); 
      $("#productId").val(ui.item.v); 
      return false; 
     } 
    }).data("autocomplete")._renderItem = function(ul, item) { 
     return $("<li></li>") 
      .data("item.autocomplete", item) 
      .append("<a>" + item.s + "</a>") 
      .appendTo(ul); 
    }; 
}); 

的问题是如果没有minLength：0它永远不会弹出，并且使用minLength：0它只会弹出一个空的文本框（键入一个char然后删除它）。

Answer 1

Jqueryui自动完成使用“标签”和“值”几乎是自动的。将's'和'v'更改为'label'和'value'，一切将如预期般运作：

<script> 
    $(function() { 
     var prd = [ 
      { label: "hallo", value: "1" }, 
      { label: "hey", value: "2" }, 
      { label: "alloh", value: "3" } 
     ]; 
     $("#product").autocomplete({ 
      source: prd, 
      minLength: 0, 
      focus: function(event, ui) { 
       $("#product").val(ui.item.label); 
       return false; 
      }, 
      select: function(event, ui) { 
       $("#product").val(ui.item.label); 
       $("#productId").val(ui.item.value); 
       return false; 
      } 
     }).data("autocomplete")._renderItem = function(ul, item) { 
      return $("<li></li>") 
       .data("item.autocomplete", item) 
       .append("<a>" + item.label + "</a>") 
       .appendTo(ul); 
     }; 
    }); 
    </script>