2017-05-01 23 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

相關問題