1

いくつかのチェックボックスがあるテーブルがあります。ユーザーがチェックボックスをクリックすると、セルの内容が更新されます。

表には、行の各グループに対してトグル効果があります。jQueryでチェックボックスを使用してセルを更新すると、この効果が反転します。

これが問題の簡単なフィドルです。チェックボックスをクリックした後にトグル効果が反転する方法に注意してください。そのため、マウスがアウトのときに行が強調表示されます。これは私が探しているものではありません。

http://jsfiddle.net/s4tWd/

これは使用される jQuery です: (私は .on('hover'.. を jsfiddle で動作させることができませんでした)

$(document).ready(function(){

    $('tr[data-demo]').hover(function() {
        var t = $(this);
        t.siblings('[data-demo="'+t.attr('data-demo')+'"]').toggleClass('hover');
        t.toggleClass('hover');
    });

    $('.demo').click(function(){
        $(this).parent().html('text');
    });

});
4

2 に答える 2

1

ホバーをマウスオーバーとマウスアウトに変更します。できます。

$(document).ready(function(){
    $('tr[data-demo]').mouseover(function() {
        var t = $(this);
        t.siblings('[data-demo="'+t.attr('data-demo')+'"]').addClass('hover');
        t.addClass('hover');
    });
    $('tr[data-demo]').mouseout(function() {
        var t = $(this);
        t.siblings('[data-demo="'+t.attr('data-demo')+'"]').removeClass('hover');
        t.removeClass('hover');
    });

    $('.demo').click(function(){
        $(this).parent().html('text');
    });
});

フィドル: http://jsfiddle.net/VinnyFonseca/s4tWd/1/

于 2013-03-19T11:24:10.583 に答える
1

コールバック機能を利用して、ホバー時に設定されたクラスを削除します。サンプルを見る

$(document).ready(function(){

  $('tr[data-demo]').hover(function() {
    var t = $(this);
    t.siblings('[data-demo="'+t.attr('data-demo')+'"]').addClass('hover');
    t.addClass('hover');
  },function() {
    var t = $(this);
    t.siblings('[data-demo="'+t.attr('data-demo')+'"]').removeClass('hover');
    t.removeClass('hover');
  });

  $('.demo').click(function(){
      $(this).parent().html('text');
  });

});
于 2013-03-19T11:28:06.870 に答える