4

私は次のJavascript/jQuery関数を持っています：

function addEventHandler(){

    $("div").mouseenter(function() {
        $(this).html("Over");
    }).mouseleave(function() {
        $(this).html("Out");
    });

}

動作しますが、完全ではありません。divはわずかに重なることがあり（尋ねないでください）、下の図が伝えようとしているように、必ずしも「Out」値を取得するとは限りません。これは、ポインターをそれらの上に非常に速く移動した場合に特に発生します。

代替テキスト

すべてのdivがmouseleaveで「Out」値を取得することを確認する方法はありますか？ありがとう！

更新：実際のコードの抜粋

私の実際の関数は上記の例ほど単純ではないため、実際の関数の正確なコードをここに含めました。

function addEventHandlers(){

    var originalContent = "";

    $(".countryspots div").mouseenter(function() {

        var thisClass = $(this).attr("class");
        var thisCountry = thisClass.split(" ");
        var thisNumber = getNumber(thisCountry[1]);

        originalContent = $(this).children("a").html();

        $(this).children("a").html("<span>" + thisNumber + "</span>");


    }).mouseleave(function() {

        $(this).children("a").html(originalContent);

    });

}

そして、私のHTMLマークアップは次のようになります。

<div class="countryspots">
    <div class="america brazil"><a href="#"><span>Brazil</span></a></div>
    <div class="america argentina"><a href="#"><span>Argentina</span></a></div>
    <div class="europe ireland"><a href="#"><span>Ireland</span></a></div>
    <div class="europe portugal"><a href="#"><span>Portugal</span></a></div>
</div>

一般的な考え方は、最も内側の国の名前が（から取得された）<span>の従業員を表す番号と交換され、次にに戻されるというものです。mouseentergetNumber();mouseleave

本当の問題は、ポインターを別のdivに移動したときに、多くのdivが従業員番号を保持することです。つまり、mouseleaveイベントはすべてのdivで実行されるわけではありません。

実例： http： //jsfiddle.net/N9YAu/4/

お役に立てれば。再度、感謝します！

4

3 に答える 3

2

問題は、すべてのアイテムの「元のコンテンツ」を格納する変数が1つしかないことです。また、mouseenterハンドラーの前にハンドラーを2回呼び出すと、mouseleave「元のコンテンツ」変数の値がホバーによって上書きされる可能性があります。コンテンツ。

スクリプトの開始時に元のコンテンツを1回保存し、アイテムごとに個別に保存する必要があります。これは、jQueryのdata関数を使用した次の例で行いました：http：//jsfiddle.net/N9YAu/5/

mouseenter注意：個別の/mouseleaveバインディングを1つのバインディングに置き換えましたhover。それはおそらく最終的には同じですが、それはそれを行うための「適切な方法」です。

于 2010-11-26T11:06:50.977 に答える
0

問題を再現できませんでした：

http://www.jsfiddle.net/N9YAu/1/

そこでもあなたに起こっているのですか？

于 2010-11-26T08:48:20.467 に答える
0

これらのdivのいずれかが、万が一HTML内の他のdiv内にネストされますか？

マウスポインタがトップレベルのdivに入り、他のdivに入るときに「離れる」のではなく、トップレベルの子であるため（絶対に配置されている場合でも）、何か関係があるのではないかと考えています。

于 2010-11-26T09:01:29.450 に答える