2017-05-01 24 views
0

我想在用户点击输入字段时建议用户输入,但是我想在输入字母时保留一个建议列表。JQuery自动完成在点击时有一个建议,当打字时有不同的建议

例如,让我们说,我有这个简单的代码:

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

我想添加的功能,为用户拥有另一种意见认为,当他点击了表单输入假设“巨蟒 例如英寸这一形象,一个有一个建议(“软”)一旦我们点击输入字段:

here

然后我们就可以有一个建议列表,当我们开始输入字母:

here2

谢谢你的帮忙。

+0

什么是你的'minlength'设置? –

+0

嗨... 您是否希望用户从第一次自动填充中选择一些建议,然后基于他的选择,他应该看到另一个自动填充功能,并提供与第一次自动填充选择相关的建议? 如果是这样,我做了一个jsfiddle:请检查你是否想要这个。 http://jsfiddle.net/9R4cV/765/ 如果您更新确切的要求,我会更新我的答案。 – Nitesh

回答

0

我有两个从你的问题的理解,我想从两个观点来回答:

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/

+0

谢谢你这个答案,但不幸的是你错过了这一点,我想要的是** 1)**当我点击输入** 2)**时出现单词“Python”**列出其他单词而不是“ Python“出现在我开始输入一些单词时。我想我没有正确解释,我的不好。 – ThisIsMe

+0

现在看起来好吗? http://jsfiddle.net/9R4cV/771/ – Nitesh

+0

完美!非常感谢 – ThisIsMe

相关问题