2011-12-16 5 views
0

ユーザーが行を強調表示する行のいずれかをクリックすると、いつでもテーブルが表示されます。しかし、複数の行がハイライト表示されている場合は、ハイライトされていない行をクリックしてハイライトを消さなければなりません。個人がテーブルをクリックしていないときに、すべての行のハイライトを削除するようにしたいと思います。これは私が使用しているコードです。テーブル内の強調表示された行でグループを非表示にする方法

テーブル以外の場所をクリックすると、どのように表示されるのですか?

答えて

2

実際にレンダリングされたマークアップの例を投稿する必要があります。あなた次のマークアップを想定し

...あなたは親ノードを選択removeClassをするだろう、toggleClassを行うにはしたくない...

<body> 
... 
    <table id="myTable">...</table> 
... 
</body>

あなたは次のことを結合することができる。..

$('body').click(function(evt){ 
    //evt.target is what was clicked on, which bubbles up to body 
    //if it's anything inside #myTable, you will get the #myTable 
    var el = $(evt.target).closest('#myTable'); 

    //if you didn't get #myTable, you clicked outside the table 
    //remove the given class from all the tr's 
    if (!el.length) $('#myTable .tr_highlight_ed').removeClass('tr_highlight_ed'); 
});
+0

ありがとうございました –

2
$(document).bind('click.table', function (e) { 
    if ($("#my-table").has(e.target).length === 0) { 
      $("#my-table").find("tr").removeClass('tr_highlight_ed'); 
    } 
}); 

毎回ユーザーがページ上の任意の場所をクリッククリックされた要素がテーブル内にある場合、それがチェックされます。そうでない場合は、すべての行を非表示にします。

関連する問題