1

マウスダウン時にマウスオーバーイベントをバインドして、クリックアンドドラッグの効果を取得してtdを選択するjquery関数を作成しました。テーブルの行に 10 個の td があります。このコードの問題は、1 から 5 までの td を選択したい場合、td1 をマウスダウンし、td5 までマウスオーバーすると、td1 が選択されず (チェックボックスをチェック/チェック解除している)、代わりに td2 から選択されます。 td5. どうすれば修正できますか？どんな提案でも大歓迎です。

コードは次のとおりです。

$("#custom-interval-tbl td").mousedown(function() {
     $('#custom-interval-tbl td').bind('mouseover',function(){
            if($(this).find('input:checkbox').is(':checked')) {
                       $(this).find('input:checkbox').attr("checked", "");
                       $(this).css({background:"white"});
            } else {
                       $(this).find('input:checkbox').attr("checked", "checked");
                       $(this).css({background:"#6D7B8D"});
            }
     });
});

ありがとう

4

1 に答える 1

0

イベントを割り当てるときmouseover、マウスがすでにダウンしているイベントによってアクティブになることはありません。(マウスはすでに上にあるため、呼び出されることはありません。)

既に選択した TD でこれを強制的に呼び出すことができます。

$("#custom-interval-tbl td").mousedown(function() {
     $('#custom-interval-tbl td').bind('mouseover',function(){
            if($(this).find('input:checkbox').is(':checked')) {
                       $(this).find('input:checkbox').attr("checked", "");
                       $(this).css({background:"white"});
            } else {
                       $(this).find('input:checkbox').attr("checked", "checked");
                       $(this).css({background:"#6D7B8D"});
            }
     });
     $(this).mouseover(); // This part will call the mouseover event on your clicked TD
});
于 2012-08-15T18:21:04.493 に答える