使用JQuery UI自動填充小部件時處理textbox .change

我有一個帶有JQuery UI自動填充功能的搜索框。我希望將用戶輸入的術語與一組案例進行比較（請參閱下面switch語句中的「小貓」和「小狗」，另請參見JSFiddle：http://jsfiddle.net/XcbMQ/4/）。使用JQuery UI自動填充小部件時處理textbox .change

這個現有的代碼工作如果用戶鍵入整個單詞「小貓」：

$('#change').text("nothing entered yet") 

var $typeahead = new Array ("kittens","puppies","giraffe","trucks"); 

$('#query').autocomplete({source: $typeahead, autoFocus: true}).change(function() { 
var text = $(this).val().toLowerCase(); 
switch (text) { 
    case "kittens": 
     $('#change').text("kittens"); 
     break; 
    case "puppies": 
     $('#change').text("puppies"); 
     break; 
    default: 
     $('#change').text("neither kittens nor puppies");  
     break; 
} 
});

但是，如果用戶需要自動完成的優勢和箭頭下來只鍵入幾個字母后，選擇選項「小貓」，那麼什麼都不會發生 - 因爲我的函數綁定了.change，並且.query在#query上觸發時，還沒有匹配。 IE用戶輸入「ki」然後向下箭頭，這與「小貓」不匹配。

如何更改我的功能，使其不會觸發，直到輸入完整的單詞（用戶手動輸入「kittens」）或用戶輸入「ki」，然後從自動完成選項中進行選擇？換句話說：除了.change以外，還有什麼選項可以檢測文本框中是否有條目？

來源

2013-05-02 Ila

.blur是文本框丟失焦點時的關鍵觸發器操作。這意味着用戶可以鍵入整個單詞「小貓」，或者開始向下滾動自動更正列表，這將觸發我的功能。

http://docs.jquery.com/Events/blur#fn

來源

2013-05-02 15:57:20 Ila

使用JQuery UI自動填充小部件時處理textbox .change

回答

相關問題