JQuery - 現在のテーブル内のすべてのチェックボックスを選択する

Question

C＃で2つのネストされたリピーターがあります。外側にはいくつかのグループ化情報があり、内側にはX個のチェックボックスがあるテーブルがあります。

私はY個のテーブルを持っています。各テーブルの上部にチェックボックス（各行にチェックボックスがあります）が表示されます。私がしたいのは、各テーブルの上部にあるチェックボックスから単一のテーブル内のすべてのチェックボックスを選択できることです。

次のように私は一度ですべてのチェックボックスを選択することができます。

$(document).ready(function() { 
     $("#checkboxflipflop").click(function() { 
      var checked_status = this.checked; 
      $(".storecheckbox input").each(function() { 
       this.checked = checked_status; 
      }); 
     }); 
    }); 

を私は（各テーブルの一番上にあるチェックボックスをしている、現在のテーブルに選択範囲を狭くする方法を見つけ出すことはできません第1行）。

おかげ

EDITは....申し訳ありませんが、私は全く私たちを上に移動させて頂く場合我々はjQueryのの1.26とない確かにあることを言及するのを忘れてしまいました。つまり、「最も近い」という意味ではありません。

Answer 1

はそれを

$('th input:checkbox').click(function(e) { 

var table = $(e.target).closest('table'); 
$('td input:checkbox', table).attr('checked', e.target.checked); 

}); 

を行うには

Working Demo 2つのテーブルが別のテーブルにネストされている（意味的に恐ろしいと思いますが）です。ここでは、スニペットだあなたはまだclosest()

$('th input:checkbox').click(function(e) { 

var table = $(e.target).parents('table:first'); 
$('td input:checkbox', table).attr('checked', e.target.checked); 

}); 

Answer 2

$(this).closest("table").find("input:checkbox") 

注：これは、すべての選択ALL-IN-この-テーブルのチェックボックスが同じidを持っているようだ、idは、ページ内で一意である必要があり、あなたの代わりにクラスを使用する必要があります。 （またはちょうどtable th input）

Answer 3

各テーブルには「すべてチェック」チェックボックスがあります。なぜそれは.checkallのクラスを与えないのですか？

$('.checkall').click(function(){ 
    var checked_status = this.checked; 
    $(this).closest('table').find('input:checkbox').each(function(){ 
    this.checked = checked_status; 
    }); 
}) 

代わりに、あなたは.checkallクラスを使用したくない場合は、あなたのようなセレクタを使用します：

$('.storecheckbox input:nth-child(1)').click` 

意味、「ときに最初の入力次に、この（未テスト）を行うことができますクラス.storecheckboxをクリックすると要素内...」次のようなものがあるべき

Answer 4

の代わりにparents()を使用し、jQueryの1.2.6を使っているので

：コード

EDITを見るためにURLに/編集を追加ページの現在のデザインごとに機能するはずです。

// iterate over all the tables in the page 
$("table").each(function() { 
    // attach a click event on the checkbox in the header in each of table 
    $(this).find("th:first input:checkbox").click(function() { 
     var val = this.checked; 
     // when clicked on a particular header, get the reference of the table & hence all the rows in that table, iterate over each of them. 
     $(this).parents("table").find("tr").each(function() { 
      // access the checkbox in the first column, and updates its value. 
      $(this).find("td:first input:checkbox")[0].checked = val; 
     }); 
    }); 
});