0

大きな検索バーのdivを、そのdivからマウスを離すとすぐに消えるようにしようとしています（ただし、別の検索バーで.click関数を使用して大きな検索バーが表示された後でのみ）。

これが紛らわしいように聞こえたら申し訳ありませんが、これは私がこれまでに行ったことです：

$("#bar-b").click(function() {
    $("#quickSearch").show();
});

#bar-bdivは小さなメイン検索バーであり、クリックすると、小さなメイン検索バーの#quickSearchすぐ下にdiv（作成した大きな検索バー）が表示されます。私がやろうとしているのは、カーソルを#quickSearchdivに移動するときです（変更が行われないことを期待しているので、何も起こりません。これまでのところ、これまでのところです）が、カーソルを#quickSearchdivから離すときは、 #quickSearchdivが消えます。誰かが私にそれをする方法を教えてくれるなら、私はそれを感謝します。

私はいくつかの試みをしましたが、次のように間違っていることが判明しました：

$("#bar-b").click(function() {
    $("#quickSearch").show();
});

$("#quickSearch").mouseleave(function() {
    $("#quickSearch").hide();
});

HTMLタグ（役立つ場合は、各divの下にリストされています）：

<div id="bar-b">
    <a name="thesearchbox"></a>
    <input id="Keyword" accesskey="4" type="text" name="keyword" value="Search   Jessops - Keyword, name, catalogue no." style="color: rgb(153, 153, 153); ">
    <input id="cmdSearch" class="button" type="submit" value="">
</div>

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none;">/div>
4

3 に答える 3

1

このjsfiddleリンクを確認してください

コードに構文エラーがあります 

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none </div>

div に終了タグがありません..私はそれを修正し、動作しています

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none;"> </div>​​​​​​​​​​​​
于 2012-08-16T08:57:32.133 に答える
1

私はこれがあなたの求めているものだと思います。私はjsFiddle の例を一緒に投げたので、遊んでみることができます。または、要件から外れている場合はさらに教えてください。改善を試みます。

$("#bar-b").bind("click", function() {
    $("#quickSearch").show();
});

$("#quickSearch").bind("mouseout", function() {
    $(this).hide();
});
​
于 2012-08-16T09:08:33.457 に答える
0

私があなたのことを正しく理解していれば、あなたは正しい道を進んでいるように見えます。正しい状況でのみ隠れるようにする必要があります。これを実現する最も簡単な方法は、変数を追加して状態を保存し、それをtrueイベント リスナー関数に設定することです。openedWithClick = trueシナリオに応じて、入力されたマウスのチェックも追加する可能性があります。mouseout()また、ではなくを使用することもできmouseleave()ます。これが問題ではない場合は、サンプル コードで正確に何が起こっているのか、また、それが予想されるものとどのように異なるのかを明確にする必要があるかもしれません。

于 2012-08-16T08:57:04.880 に答える