2

そのため、フィールドへのユーザーの部分的な入力に基づいてコンテンツを提案する自動提案ボックスを備えた入力フィールドを構築しています。スタック上のタグボックスのようなものです。自動提案ボックスは、入力フィールドの真下に完全に配置され、ユーザーがテキストの入力を開始したときにのみ表示されます。

入力フィールドがぼやけているとき、つまりユーザーがサイトの他の場所をクリックしたときに、ボックスを非表示にしたいと考えています。通常、jquery のblur()関数を使用して自動提案ボックスを非表示にします。問題は、このようにすると、入力フィールドがぼやけて自動提案ボックスが非表示になるため、ユーザーは自動提案ボックスから何も選択できなくなることです。ユーザーが入力フィールドまたは自動提案ボックス以外の場所をクリックした場合に、自動提案ボックスを非表示にする方法を見つける必要があります。jqueryを使用してそれを設定する方法はありますか?

次のように設定されていると想像してください。

<div id="auto_suggest">
<ul>
<li>Jane</li>
<li>john</li>
</ul>
</div>

<input type="text">
4

1 に答える 1

4

タイムアウトを使用します。

$("input, #auto_suggest, #auto_suggest a").blur(function() {
   $('#auto_suggest').addClass('hiding');
    setTimeout(function(){
        $('#auto_suggest.hiding').hide();
    },1000);
}).focus(function() {
   $('#auto_suggest').removeClass('hiding').show();
});

$('#auto_suggest, #auto_suggest a').focus(function() {
   $('#auto_suggest').removeClass('hiding').show();
});​

タブまたはクリックでうまく動作するように更新されました。

http://jsfiddle.net/iambriansreed/vUeeT/

于 2012-06-21T20:46:17.130 に答える