layui的复选框变为单选

checkBox单选：

　　比较喜欢layui的checkbox的样式，功能要求单选。我的第一想法就是js控制嘛。像下面一样。

 1 $(document).ready(function(){
 2     $('#checkOnly').find(':checkbox').each(
 3          function(){
 4          $(this).click(function(){
 5          　　if($(this).is(':checked')){
 6             　　$(this).attr('checked',true).siblings().attr('checked',false);
 7                }else{
 8                　　$(this).attr('checked',false).siblings().attr('checked',false);
 9                }
10             });
11         }
12     );
13 });

　　达不到效果。排除后发现，不加上layui的from的样式是完全可以达到效果的。那原因在layui本身了。百度了一波。

 1 layui.use(['element', 'form', 'laydate'], function() {
 2      var form = layui.form;
 3      var laydate = layui.laydate;
 4      form.on('checkbox(oneCheck)', function(data){       
 5      　　$("input[name='checkOne']").prop("checked", false);
 6         $(this).prop("checked", true);           
 7         form.render('checkbox');    
 8      });      
 9      form.render('checkbox');
10 });

　　测试后发现是完全可以的。附上：

 1 　　　<form class="layui-form" action="" lay-filter="example">
 2          <div class="layui-form-item">
 3              <div class="layui-input-block" id="checkOnly">
 4                  <input type="checkbox"  title="一个月" name="checkOne" value="1" lay-filter="oneCheck"  checked>
 5                  <div class="layui-unselect layui-form-checkbox">
 6                      <span>一个月</span>
 7                      <i class="layui-icon layui-icon-ok"></i>
 8                  </div>
 9                  <input type="checkbox"  title="三个月" name="checkOne" value="3" lay-filter="oneCheck">
10                  <div class="layui-unselect layui-form-checkbox">
11                      <span>三个月</span>
12                      <i class="layui-icon layui-icon-ok"></i>
13                  </div>
14                  <input type="checkbox"  title="半年" name="checkOne" value="6" lay-filter="oneCheck">
15                  <div class="layui-unselect layui-form-checkbox">
16                      <span>半年</span>
17                      <i class="layui-icon layui-icon-ok"></i>
18                  </div>
19                  <input type="checkbox"  title="一年" name="checkOne" value="12" lay-filter="oneCheck">
20                  <div class="layui-unselect layui-form-checkbox">
21                      <span>一年</span>
22                      <i class="layui-icon layui-icon-ok"></i>
23                  </div>
24              </div>
25          </div>
26      </form>