类似于单选按钮的复选框| 使用icheck.js

Question

我创建了三个复选框，如下所示：

<input type="checkbox" name="upgrade">
<input type="checkbox" name="upgrade">
<input type="checkbox" name="upgrade">

我希望这些复选框像单选按钮一样工作，并使用以下jQuery，几乎可以实现这一点。 我也在使用icheck.js库，因此我正在执行jQuery代码，如下所示：

$('input[type="checkbox"]').on('ifChanged', function() {
        $('input[name="' + this.name + '"]').not(this).iCheck('uncheck');
});

但是，这仅适用于第一个更改，一旦我第三次单击它就不再起作用。 谁能告诉我我做错了什么？

Answer 1

我不能使用Icheck插件，但是我使用了标准复选框。

 $('input[type="checkbox"]').click( function(){ if( $(this).is(':checked') ){ $('input[type="checkbox"]').prop('checked',false); $(this).prop('checked',true); } else { $(this).prop('checked',true); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="checkbox" name="upgrade" checked> <input type="checkbox" name="upgrade"> <input type="checkbox" name="upgrade"> 

Answer 2

根据先前的答案，没有理由在其中使用if语句。此解决方案将删除所有选中的内容，然后在之后检查相应的选择。

HTML：

<input type="checkbox" name="upgrade">
<input type="checkbox" name="upgrade">
<input type="checkbox" name="upgrade">

JS：

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

https://jsbin.com/qeqemuqaci/edit?html,js，输出