0

頭がおかしくなる - 私の同僚がこのスクリプトを送ってくれた - 私は単純なことを見落としているに違いない

http://jsfiddle.net/mplungjan/j4m62/

なんらかの理由でわかりませんが、クリックしたものに関係なく、3つのチェックボックスすべてをチェックします-最初の2つのいずれかをクリックすると最初の2つだけがチェックされ、3つ目は単独でチェックされると予想されます

HTML:

<input class="check-all" name="checkbox[]"  id="checkbox1" type="checkbox" value="on"/><label for="checkbox1">Check 1&2</label><br/>

<input class="check-allfeatured" name="checkbox[]"  id="checkbox2"  type="checkbox" value="on"/><label for="checkbox2">Check 1&2</label><br/>

<input class="check-alldel" name="deleteids[]"  id="deleteids1"  type="checkbox" value="on"/><label for="deleteids1">Check this only</label>

JavaScript:

$(document).ready(function(){
  $('.check-all:checkbox').click(function(event) {
      var group = 'input:checkbox[name=' + $(this).attr('name') + ']';
      console.log(group+':'+event.target.checked);
      $(group).each(function(){
          $(this).attr("checked",event.target.checked);
      });
  });

  $('.check-alldel:checkbox').click(function(event) {
      var group = 'input:checkbox[name=' + $(this).attr('name') + ']';
      console.log(group+':'+event.target.checked);
      $(group).each(function(){
          $(this).attr("checked",event.target.checked);
      });
   });

  $('.check-allfeatured:checkbox').click(function(event) {
      var group = 'input:checkbox[name=' + $(this).attr('name') + ']';
      console.log(group+':'+event.target.checked);
      $(group).each(function(){
          $(this).attr("checked",event.target.checked);
      });
  });
});
4

2 に答える 2

1

きれいではありませんが、修正版はこちらです: http://jsfiddle.net/j4m62/8/

あなたの問題は、チェックボックス名アサーションの名前を引用符で囲んでいないことでした。

変化する：

var group = 'input:checkbox[name=' + $(this).attr('name') + ']';

の中へ：

var group = 'input:checkbox[name="' + $(this).attr('name') + '"]';

期待どおりの動作が得られます。しかし、実際には多くの重複したコードがあるため、クリックされたチェックボックスに関係なく同じ操作を実行しているため、おそらくリファクタリングする必要があります。これをチェックしてください。

イベントを明示的に渡すのを忘れたことを指摘してくれた@limelightsに感謝します。リンクを更新しました。

于 2012-04-17T12:56:14.997 に答える
1

以下のコードは、group変数に含まれているため、input:checkbox[name=checkbox[]]すべてのチェックボックスをチェックし、ケースのすべてのチェックボックスを選択します。

$(group).each(function() {
  $(this).attr("checked", event.target.checked);
});
于 2012-04-17T12:52:17.717 に答える