Layui form表单input checkbox复选框改单选onclick失效问题

情景：因为layui class="layui-form"样式，单选框样式不好看改为复选框并把复选框改为单选遇到的问题

一、出现问题： form标签中使用class=“layui-form” 导致input中onclick中跳转函数失效，去掉class="layui-form"后可成功跳转但是样式失效问题；

问题代码

<form class="layui-form" action="" style="margin: 50px auto;">
	<div class="layui-form-item">
		<div class="layui-input-block">
			<input type="checkbox" name="check" value="1" title="XX" οnclick="checkCanel(this)"/>
			<input type="checkbox" name="check" value="0" title="不XX" οnclick="checkCanel(this)"/>
		</div>
	</div>
</form>

function checkCanel(Obj) {
			$("input[name='check']").each(function(){
				$(this).attr("checked",false);
			});
			Obj.checked=true;
		}

二、解决方法：

---

1. 法一：经百度方法问题出现可能是因为：name 与 onclick命名一致问题导致(未解决)
2. 法二：去掉onclick使用form.on

<form class="layui-form" action="" style="margin: 50px auto;">
	<div class="layui-form-item">
		<div class="layui-input-block">
				<input type="checkbox" name="check" value="1" title="XX" lay-filter="filterName"/>
				<input type="checkbox" name="check" value="0" title="不XX" lay-filter="filterName"/>
		</div>
	</div>
</form>

layui.use('form', function () {
			var form = layui.form();
			form.on('checkbox(filterName)', function (data){
				var val = data.value;
				//如果checkbox的值不等于选中的checkbox的值则移出选中状态
				$(":checkbox[name='check'][value!='" + val + "']").removeAttr('checked');
				form.render();
			})
		})