3

アコーディオンコンテナごとにチェックボックスのグループを持つjQueryアコーディオンを使用しています。これらのそれぞれに、2 つのボタン (選択と選択解除) があり、クリックすると、その特定のアコーディオン コンテナー内のすべてのチェックボックスのみを選択/選択解除する必要があります。コードがほぼ正しいと確信しているので、非常に苛立たしいので、誰かが私の愚かさに気づき、兄弟を助けてくれることを願っています:

jQuery:

 // Select all for groups:
   $(".group_buttons").on("click",function() {
       var btn_request = $(this).attr("rel");
       var group = $(this);
       if(btn_request == "add") {
           $(this).parent(".controller_box").find('input:checkbox')
                .attr('checked',true);
       } else {
           $(this).parent(".controller_box").find('input:checkbox')
                .attr('checked', false);
       }
       return false;
   });

サンプル HTML:

  <div class='controller_box'>
       <a href='' rel='add' class='group_buttons'>Select all</a>
       <a href='' rel='rem' class='group_buttons'>Select all</a>
       <input type='checkbox' name='sample1' value=1 />
       <input type='checkbox' name='sample2' value=1 />
  </div>
4

1 に答える 1

3

メソッドを使用できますprop()：

特定の状況では、属性とプロパティの違いが重要になる場合があります。jQuery 1.6 より前では、一部の属性を取得するときに .attr() メソッドがプロパティ値を考慮に入れることがあり、一貫性のない動作を引き起こす可能性がありました。jQuery 1.6 以降、.prop() メソッドはプロパティ値を明示的に取得する方法を提供し、.attr() は属性を取得します。

$(".group_buttons").on("click",function() {
   var btn_request = $(this).attr("rel");
   if(btn_request == "add") {
       $(this).parent().find('input[type="checkbox"]').prop('checked', true);
   } else {
       $(this).parent().find('input[type="checkbox"]').prop('checked', false);
   }
   return false;
});

:checkboxセレクターはご了承くださいdeprecated。

.group_buttons動的に生成される 場合は、clickイベントを委任する必要があります。

$("body").on('click', '.group_buttons', function() {
   var btn_request = $(this).attr("rel");
   if(btn_request == "add") {
       $(this).parent().find('input[type="checkbox"]').prop('checked', true);
   } else {
       $(this).parent().find('input[type="checkbox"]').prop('checked', false);
   }
   return false;
});
于 2012-07-21T11:28:53.913 に答える