JavaScriptでCheckBoxの全選択、全解除について

Question

今以下の方法でCheckBoxの全選択、全解除を実現しています。

    $( checkAll ).on('click', function(e) {
        //$( checkBox ).prop('checked', this.checked );
        $(checkBox).prop('checked', $(this).prop('checked')).trigger('change');
    });

今Tableは100行分最初に用意しておき、必要に応じて１０行だったり２０行だったりを表示しています。
しかし上記の方法では画面に見えてない残りの９０行分もチェックボックスがONされてしまいます。
表示されている行のみチェックONさせる方法はないでしょうか？

<table id=srctable>
  <thead>
    <tr>
      <th><input type="checkbox" id="checkAll"></th>
      <th>社員番号</th>
      <th>社員名</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox" name="chk1"></td>
      <th>0001</th>
      <th>AAAA</th>
    <tr>
    <tr>
      <td><input type="checkbox" name="chk1"></td>
      <th>0002</th>
      <th>BBBB</th>
    <tr>
    <tr>
      <td><input type="checkbox" name="chk1"></td>
      <th>0003</th>
      <th>CCCC</th>
    <tr>
  </tbody>

となっております。
表示の処理は

    for(i=0; i<a_tr_items.length; i++){
        if(i<(list_num)){
            tr_items[i].style.display = 'table-row';
        } else {
            tr_items[i].style.display = 'none';
        }
    }

でやっております。
list_numには何件表示するかの値が入っております。

Comments

[m.ts10806]

「表示されている」「表示されていない」「画面に見える」「画面に見えない」状態はどのように表現されているか提示してください。
それ次第でやり方はかわります。

[kei344]

Table構造や書き換えに使っているライブラリなど、状況を再現できるようにされたほうが回答を得やすいと思います。

[limitman80]

表示したい行は
style.display = 'table-row';
表示したくない行は
style.display = 'none';
でやっております。

[m.ts10806]

htmlとその部分を切り替えているJavaScriptのコードをご提示ください。

Answer 1

$(checkBox).filter(':visible').prop('checked', $(this).prop('checked')).trigger('change');

https://api.jquery.com/filter/

Answer 2

詳細情報がないのでざっとした回答ですが
notでdisplay:noneを除けば良いと思います。

Comments

[m.ts10806]

難しければループしてisで判定してもいいかな、なんて（量が多いと重くなりそうですけど）
http://www.koikikukan.com/archives/2012/08/03-012345.php

[limitman80]

どの部分にnotを入れたらいいのでしょうか？

[m.ts10806]

リンク貼ったのでそのリファレンスヒントに試してもらいたいですが・・・。
文章的には「この要素を対象にするけど”その中でもこの条件を除いた”要素にtriggerを指定する」なので。つじつまが合うようにつなげてください。