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插件，但我使用了标准复选框。

＆＃13;

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

＆＃13;

<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">

＆＃13;

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,output

复选框就像单选按钮一样使用icheck.js

2 个答案: