0

次のような状況があります。

キーワードを入力できるテキストボックス。keyup イベントは、データベースで類似のキーワードを検索する AJAX スクリプトをトリガーします。show()見つかった場合、見つかったキーワードを含む DIV が表示されます ( )。

div 内のキーワードの 1 つをクリックすると、選択したキーワードがテキスト ボックスに書き込まれ、div が非表示になります ( hide())。

しかし、DIV が表示されていて、フォーム内の別の場所をクリックするか、テキスト ボックスからタブで移動すると (focusout イベント)、DIV を非表示にしたいと思います。

これは focusout イベントで行うことができます。しかし、DIV のキーワードのクリックを登録するためにクリック イベントを使用し、フォーカスアウト イベントを登録するために focusout イベントを使用すると、次の問題が発生します。非表示ですが、キーワードはテキストボックスにコピーされません。

現在、次のコードがあります。

/*click on found "link with class f_link" in DIV*/
$(".f_link").live('click', function(){

    $newval=$(this).attr("id");
    $("#textbox_id").val($newval);
    $("#searchresults").hide();
})


/*when losing focus textbox hide DIV */
$("#textbox_id").focusout(function(){
    $("#searchresults").hide();

})

説明:

#textbox_id : id of textbox
#searchresults: id of DIV with found results
.f_link : class of "link" in div searchresults like <span class="f_link" id="result1>result 1</span>
4

3 に答える 3

0

ぼかしが機能しませんでした (focusout は jquery のイベントでもあります..)

私はこの解決策でそれを管理しました:

$(".f_link").live('click', function(){
    $("#textbox_id").val($newval=$(this).attr("id"));
    $("#searchresults").hide();
})

$mouseover=false;
$("#searchresults").live('mouseover', function(){
    $mouseover=true;
})

$("#searchresults").live('mouseout', function(){
    $("#textbox_id").focus();
    $mouseover=false;
})



$("#textbox_id").focusout(function(){
    if ($mouseover) {
        return;
    }
    $("#searchresults").hide();
})
于 2011-07-21T17:49:22.273 に答える
0

試す：

/*when losing focus textbox hide DIV */
$("#textbox_id").blur(function(){
    $("#searchresults").hide();
})
于 2011-07-20T08:46:30.243 に答える
-1

フォーカスアウトの代わりにぼかし機能を使用できます...

$("#textbox_id").live('blur',function(){
     $("#searchresults").hide();
})
于 2011-07-20T08:54:32.527 に答える