使用jQuery取消选中所有复选框，然后检查单击的复选框

我有以下内容：

 
Which level would you like? (Click all that apply)
 Level 1
 Level 2
 Level 3
 Level 4
 Level 5
 Level 6
 Level 7
 
 
 
Which level would you like? (Click all that apply)
 Level 1
 Level 2
 Level 3
  

我希望每次单击其中一个时都清除.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); }); 

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

我做错了什么？

Answer 1

你需要使用.prop代替：

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

Answer 2

通过attr

  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); });