3

1 つのテーブル セルで 2 つのイベントが発生しています。1. .hover(on, off) の単純な tr 行ハイライターと 2. onclick で、その下の div をスライドして開きます。

どちらのアイテムも希望どおりに機能します。私がやろうとしているのは、tr がクリックされたときに .hover 関数 (マウスアウト時) の 2 番目の部分が起動しないようにして、div を開いたときに強調表示されたままにすることです。関数でクラスを使用してみましたが、99% の確率で、マウスがまだその上にあるときにそれをハイライトするのに疲れます。そのため、マウスを離すと通常の lo-lite 状態に戻ります。

では、.click() 呼び出しを使用して、別の .hover 呼び出しの 2 番目の関数部分の実行を停止するにはどうすればよいでしょうか?

これらの関数はそのままでは少しばかげているように見えますが、私の実際のコードでは、さらに多くのことが行われています。したがって、これらはアクションの削除された部分です。

.hover( function(){
$(this).removeClass('xhead'); $(this).addClass('headerhover'); } , function(){ $(this).removeClass('headerhover') $( this).addClass('xhead'); } );

この：

function togglediv(id){
    $("#"+id).toggle("fast");
}

から呼び出されます:

function loadmenu(id){
    var divid = 'div_'+id+'_detail';
    togglediv(divid);
}

これは次の 2 番目の呼び出しです。

$('.viewer').click(function(e) {        
    var id = e.target.id;                   
    loadmenu(id);           
    }
});

フィドルが仕事でブロックされています...申し訳ありませんが、簡単にすることはできません。

アイデアを高く評価します。

それの長いと短いは、.vm クリックで、headerhover を固定し、mouseout イベントを xhead クラスに返さないようにすることです。それ以外の場合、クリックがない場合は、クラス スワップを実行して行の強調表示を行います。

4

1 に答える 1

1

簡単な方法？あなたのclickようなもので：

$(this).data("sticky", true);

そして、ホバー（マウスアウト部分）でそれを確認してください：

if (! $(this).data("sticky"))
{
    // proceed with hover mouseout code
}

セレクターがイベント間で整列していることを確認してください。上記のコードではそうではないため、より複雑なセレクターが必要になる$(this).closest('.xhead').data("sticky", true); かclick、この相互作用を処理するためだけに追加のイベントを定義することができます.xhead(このクリック イベントはバブル スルーし、両方で発生します)。

td.xheadまた、作成したコードで for を選択してhoverいますが、HTML にはtr.xhead.

于 2013-01-30T20:44:01.253 に答える