jquery - 仅选中一个复选框并取消选中其他复选框

Question

我当时尝试仅选中一个复选框，而其他复选框则取消选中，但是当我想检查新的 chekcbox 时，之前的复选框将取消选中，依此类推。

我尝试了这段代码:

JS文件

$('input[type="checkbox"]').click(function() {
$(".check_class").attr("checked", false);
$(this).attr("checked", true);    
});

HTML 文件

    <ons-list-header>Takistused</ons-list-header>
    <ons-list-item modifier="tappable">
      <label class="checkbox checkbox--noborder checkbox--list-item">
        <input type="checkbox" id="example">
        <div class="checkbox__checkmark checkbox--noborder__checkmark checkbox--list-item__checkmark"></div>
        vihmaveerenn
      </label>
    </ons-list-item>
    <ons-list-item modifier="tappable">
      <label class="checkbox checkbox--noborder checkbox--list-item" id="test">
        <input type="checkbox" id="example">
        <div class="checkbox__checkmark checkbox--noborder__checkmark checkbox--list-item__checkmark" ></div>
        äärekivi
      </label>
    </ons-list-item>
    <ons-list-item modifier="tappable" >
      <label class="checkbox checkbox--noborder checkbox--list-item" id="test1">
        <input type="checkbox" id="example">
        <div class="checkbox__checkmark checkbox--noborder__checkmark checkbox--list-item__checkmark"></div>
        munakivi tee
      </label>
    </ons-list-item>
  </ons-list>

我做错了什么？我尝试过不同的方法，但它在实际使用中不起作用。

Answer 1

尝试如下所示的.not(this):

$(document).on('click', 'input[type="checkbox"]', function() {      
    $('input[type="checkbox"]').not(this).prop('checked', false);      
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" id="one" />
<input type="checkbox" id="two" />
<input type="checkbox" id="three" />
<input type="checkbox" id="four" />