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

Checkbox acting like radio button | Using icheck.js

本文关键字：复选框 使用 icheck js 一样 单选按钮      更新时间：2023-09-26

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

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

然而，这只适用于第一次更改，只要我点击第三次它就不再工作了。谁能告诉我我做错了什么?

我不能使用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">

根据前面的答案，里面没有理由使用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、输出

相关文章：