0

これが私のコードのどこかに埋め込まれている別の問題なのか、それとも私が知らないホバー関数の問題なのかはわかりません-

要するに、私は2つのクラスを持つ要素を持っています

<input type="image" class="classA classB" ... />

そして私はそのようなjQueryコードを持っています：

$('classA').hover(){
    function1,
    function2
}

$('classB').hover(){
    function3,
    function4
}

私が望んでいるのは、入力にカーソルを合わせると、両方のホバー関数（function1、function3）が起動することです。そして、それを離れると、両方の関数（function2、function4）も起動されます。起こっているように見えるのは、classBホバーが完全にオーバーライドまたはシャドウするか、classAホバー関数が何をしているのかということです。

これは意図された動作ですか（または、これは私のはるかに大きなコードベースに何か問題があることを示していますか？）、もしそうなら、一般的なコンセンサスはどのように回避しますか？

4

2 に答える 2

3

's hoverは、両方のクラスを持つタグの場合、それらが書き込まれる順序（'shoverの後の'shover）のために、' shoverをclassB上書きします。classAclassBclassA

解決策は次のとおりです。

$('.classA, .classB').hover(
// mouseover
function() {
    var $this = $(this);
    if($this.hasClass('classA')) {
        function1();
    }
    if($this.hasClass('classB')) {
        function3();
    }

},
// mouseout
function() {
    var $this = $(this);
    if($this.hasClass('classA')) {
        function2();
    }
    if($this.hasClass('classB')) {
        function4();
    }
});
于 2012-10-04T11:57:53.650 に答える
0

AH-HA！

さて、ここでのsp00mの答えは正しかったのですが、私の目的にはぴったりではありませんでした。私はかなりのコードを実行しているので、物事を「クリーン」（クリーン？）に保つことを望んでいました。私はおそらく元の質問でもっと明確にすべきだった...

ほら、私はすでに最初のホバーを必要とする要素と2番目のホバーを必要とする要素を持っていたので、両方を必要とする要素を持っていたとき、そのシナリオで3番目のホバーを持たないことが目的でした。コードの再利用と複雑さ！ブー！

私が気付いていなかったのは、最後に来るホバーが最初のホバーを上書きするということでした。これはおそらく、あるクラスをターゲットにしていて、最初のクラスが別のクラスをターゲットにしていたという事実と関係があります。

解決策はこれでした： 

$('.classB, .classA').hover(){
    function3,
    function4
}

幸い、マルチセレクターを使用してclassAをターゲットにすると、元のホバーは上書きされません。

つまり、入力のクラス属性からclassBを削除し、ホバーセレクターにclassAを追加しました。

于 2012-10-04T13:19:31.500 に答える