JQuery UI オートコンプリート機能を備えた検索ボックスがあります。ユーザーが入力した用語を一連のケースと比較する必要があります (以下の switch ステートメントの「kittens」と「puppies」を参照してください。こちらの JSFiddle も参照してください: http://jsfiddle.net/XcbMQ/4/ ) .
この既存のコードは、ユーザーが「kittens」という単語全体を入力した場合に機能します。
$('#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;
}
});
しかし、ユーザーがオートコンプリートを利用して、数文字だけ入力した後に下向き矢印でオプション「kittens」を選択しても、何も起こりません。私の関数は .change にバインドされており、#query で .change がトリガーされると、まだマッチしていません。IE ユーザーが「ki」と入力してから下向き矢印を入力しましたが、これは「kittens」と一致しません。
ユーザーが手動で「kittens」と入力するか、ユーザーが「ki」と入力してオートコンプリート オプションから選択することによって、単語全体が入力されるまでトリガーされないように機能を変更するにはどうすればよいですか? 別の言い方をすると、.change 以外に、テキスト ボックスに入力が行われたことを検出するオプションはありますか?