Question

我想在用户点击输入字段时建议用户输入，但我也希望在他输入信件时保留一份建议列表。

例如，让我说我有这个简单的代码：

<script>
$( "#autocomplete" ).autocomplete({
  source: [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ]
});
</script>

我想为用户添加该功能，以便在他点击表单输入时提出另一个建议，让我们说＆＃34; Python。例如，在这张图片中，一旦我们点击输入字段，就会有一个建议（＆＃34;灵活＆＃34;）

然后我们可以在开始输入信件时提供一系列建议：

感谢您的帮助。

Answer 1

我从你的问题中得到了两个理解，我想从两个角度回答：

1）点击默认自动填充功能，并进一步查看有关输入的建议。

小提琴：http://jsfiddle.net/9R4cV/768/

代码：

$(document).ready(function() {

    var first = ["ask","always", "all", "alright", "one", "foo", "blackberry", "tweet","force9", "westerners", "sport"];

    $("#firstHint").on("click", function(){
      $(this).autocomplete("search","");
    });

    $( "#firstHint" ).autocomplete({
        source: first,
        minLength:0,
        select : function(event, ui){
         if(ui.item && ui.item.value){
          alert(ui.item.value);
         }
        }
    });
});

您需要在文本框的点击事件上触发自动填充，并将minLength设置为0表示自动完成。

2）您想要点击第一次自动填充的任何建议时需要另一个自动填充功能：

小提琴：http://jsfiddle.net/9R4cV/765/

代码：

$(document).ready(function() {

    var first = ["ask","always", "all", "alright", "one", "foo", "blackberry", "tweet","force9", "westerners", "sport"];
    var second = {
    "ask" : ["to","two","three","too"],
    "one" : ["great","game","gone","going"],
    "tweet" : ["tweeter","twitter","tweety","true"]
    }

    $( "#firstHint" ).autocomplete({
        source: first,
        select : function(event, ui){
         if(ui.item && ui.item.value){
          autoSecond(second[ui.item.value]);
          $(this).addClass("hide");
          $("#secondHint").removeClass("hide").focus();
         }
        }
    });

    function autoSecond(val){
     $("#secondHint").autocomplete({
        source: val,
        select : function(event, ui){
         if(ui.item && ui.item.value){
           alert(ui.item.value);
         }
        }
    });   
    }

});

需要在选择第一个建议时隐藏第一个字段，并显示将显示新建议的第二个字段。

如果需要进行任何其他更改，请与我们联系。我会根据需要修改我的答案。

根据您的要求进行新的更改： http://jsfiddle.net/9R4cV/771/

JQuery自动完成在点击时有一个建议和输入时的不同建议

1 个答案: