以下のコードは非常に単純です。によって参照されるhtmlテキスト入力にバインドされたjQueryオートコンプリート#searchがあります。ユーザーがそれに何かを入力すると、ドロップアウト リストにサーバーからの候補が表示されます。ユーザーが候補の 1 つをクリックするか、それを選択して Enter キーを押すと、ポップアップ (フェイスボックス) が表示され、ポップアップ内に呼び出されたページが表示されます。代わりに、ユーザーが提案を選択せずに通常の検索を実行したい場合は、Enter キーを押すか をクリックして実行できます#searchButton。言い換えると：
- ユーザーがグレープフルーツなど、何かを入力します
- 選択可能な候補が表示されます。
- シナリオ 1: ユーザーがマウスまたはキーボードで候補を選択し、Enter キーを押すかクリックすると、そのアイテムがポップアップします。つまり、オートコンプリートの結果 .handler が起動します (.keypress ではありません)。
- シナリオ 2: ユーザーは候補に興味がなく、代わりに Enter キーを押すか、または をクリックし
#searchButtonて、入力した内容の完全な検索を実行し#searchます。オートコンプリートの結果ハンドラーは起動しません。代わりに、Enter キーを#searchButton押すとクリック イベントがトリガーされるか、直接トリガーされて (つまり、実際にクリックされて)、通常の検索がトリガーされます。
これは、IE6、IE7、IE8、Chrome、Safari ではうまく機能しますが、Firefox では機能しません。
Firefox では、提案に対して Enter キーが押されると、結果ハンドラーと keypress イベントの両方が発生し、ユーザーに facebox ポップアップが表示され、完全な検索が実行されます。if の場合、どういうわけか.keypress発砲が停止すると考えました。result火事はそのトリックを行いますが、私はその方法を理解できませんでした。.keypress の起動を防ぐことを期待して、 jQuery のstopPropogation()andstopImmediatePropogation()を .result ハンドラーに入れてみましたが、何も変わりませんでした。
誰かが何か考えを持っているか、これを通して私を助けたいと思っているなら、私は最も感謝しています.
前もって感謝します！
jQuery("#search").autocomplete("/index/suggest", {
selectFirst: false,
formatItem: function(data, i, n, value) {
return "<font color='#3399CC'>" + value.split("::")[0] + "</font>";
},
formatResult: function(data,value) {
return value.split("::")[0];
}
}).result(function(event, data, formatted) {
alert('Hello, someone selected a suggestion by clicking on it or pressing enter on it, so you\'re getting this!');
var pieces = formatted.split("::");
var url = '/' + pieces[1] + '/detail/?id=' + pieces[2];
jQuery.facebox({ ajax: url });
}).keypress(keypressHandler).blur(function() {
alert('I don\'t want this to appear if .result above is called, and it doesnt, except in firefox! Bah!');
jQuery(this).flushCache();
});
function keypressHandler(e)
{
if(e.which == 13) {
if(!jQuery('#searchButton').is(':disabled')) {
jQuery(this).blur();
jQuery('#searchButton').focus().click();
}
}
}