0

我有以下内容：

      <div class="pricing-levels-2">
        <p>Which level would you like? (Click all that apply)</p>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 1<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 2<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 3<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 4<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 5<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 6<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 7<br>
      </div>
      <div class="pricing-levels-3">
        <p>Which level would you like? (Click all that apply)</p>
        <input class="single-checkbox"type="checkbox" name="vehicle" value="Bike">Level 1<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 2<br>
        <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 3<br>
      </div>

我希望.pricing-levels-2每次单击其中一个时清除复选框，所以我这样做了：

jQuery('.pricing-levels-2 .single-checkbox').on('click', function(){
  jQuery('.pricing-levels-2 .single-checkbox').attr('checked', false);
  jQuery(this).attr('checked', true);
});

但问题是现在所有的复选框都清除了，即使是我选择的那个。所以我不能选择任何（我希望我点击的那个被选中）。

我做错了什么？

4

2 回答 2

5

您需要使用.prop代替：

jQuery('.pricing-levels-2 .single-checkbox').on('click', function(){
  jQuery('.pricing-levels-2 .single-checkbox').prop('checked', false);
  jQuery(this).prop('checked', true);
});
于 2013-09-25T06:51:29.647 回答
1

按属性

   jQuery('.pricing-levels-2 .single-checkbox').on('click', function(){
      jQuery('.pricing-levels-2 .single-checkbox').removeAttr('checked');
      jQuery(this).attr('checked', 'checked');
    });

参考removeAttr

通过道具

jQuery('.pricing-levels-2 .single-checkbox').on('click', function(){
  jQuery('.pricing-levels-2 .single-checkbox').prop('checked', false);
  jQuery(this).prop('checked', true);
});
于 2013-09-25T06:51:38.017 回答