1

たくさんの行を持つテーブルがあります。テーブルがあるので、人々はコピー/貼り付けを介してデータをすばやく取得できます。問題は、最後にどこからテキストを取得したか (つまり、どの行か) を簡単に把握できなくなることです。したがって、行をダブルクリックすると(コピーするテキストを強調表示するために)、行が強調表示され、再度ダブルクリックするまで強調表示されたままになる機能が必要です。

私はJqueryを使いたいと思っています。

ここに私がこれまでに持っているものがあります:

           $("tr").dblclick ( function() {
                var foo = (this);
                $(foo).css("background-color","#333");
                $(foo).css("color","white");
            });
            $("tr").mouseleave ( function() {
                var foo = (this);
                $(foo).css("background-color","#333");
                $(foo).css("color","white");
            });

ダブルクリックは機能します。しかし、マウスはすべての行を強調表示します。ダブルクリックした行に 1 つの変数を割り当てて、その行.mouseleaveだけに関数を適用することはできますか? または、私が望むものにより適した別の機能がありますか。

ありがとう。

4

3 に答える 3

2
 $("tr").dblclick ( function() {


// Unselect the previous selected row Logic
$(this).siblings().removeClass("Clicked");//Assuming the <tr> are at same level.

 //$(this).parent().children("tr").not(this).removeClass(".Clicked");    

 $(this).toggleClass("Clicked");

});

に変更 $("tr").mouseleave ( function() {});します$("document").on( "mouseleave","tr.Clicked",function() {});

また、次のようなcssを持っているのは良いことです-

.Clicked{
background-color : #333;
color : white;

}
于 2013-05-27T04:37:35.007 に答える
0

1 つのフラグを追加して、どのフラグがダブルクリックされたかを識別することができます。フラグが true の場合は、mouseleave 関数のみを適用します。

そのような場合にイベントを割り当てる場合は、委任方法も適用する必要があります。すべての tr またはすべての li のように。

さらに、dblclick イベントと同じことを行っているため、ここでは mouseleave イベントの意味がわかりませんでした。

   var allTr=$('#tableId').find('tr');
    $('#tableId').on('.dblclick','tr',function() {
        var foo = $(this);

        //to remove css and attribute from privous selected tr
        allTr.css({"background-color","#333","color","white"}).removeData('clicked')
       //if you want to remove css when you double click again on same tr than use this if condition other wise dont use.
       if(!foo.data('clicked')){
           foo .css({"background-color","#333","color","white"}).data('clicked',true);
       }
    }).on('mouseleave','tr',function() {
        var foo = $(this);
        if(foo.data('clicked')){
          foo .css({"background-color","#333","color","white"});
        }
    });
于 2013-05-27T04:38:15.020 に答える