1. script代码
layui.use(['layer', 'form', 'laydate'], function () {
		var laydate = layui.laydate;
		var form = layui.form;
		var layer = layui.layer;
		var $ = layui.$;
//全选被选中  其他都被勾选
		form.on('checkbox(checkall)', function (data) {
			var id = data.value;
			console.log(id)
			//这里实现勾选 
			$('.checkone').each(function (index, item) {
				item.checked = data.elem.checked;
			});
			form.render('checkbox');

		});
		//有一个未选中全选取消选中
		form.on('checkbox(c_one)', function (data) {
			var item = $(".checkone");
			for (var i = 0; i < item.length; i++) {
				if (item[i].checked == false) {
					$("#c_all").prop("checked", false);
					form.render('checkbox');
					break;
				}
			}
			//如果都勾选了  勾上全选
			var all = item.length;
			for (var i = 0; i < item.length; i++) {
				if (item[i].checked == true) {
					all--;
				}
			}
			if (all == 0) {
				$("#c_all").prop("checked", true);
				form.render('checkbox');
			}
		});
		//取值
		form.on('checkbox', function (data) {
			console.log(data)
			var myaaa = document.getElementsByName("aaa")
			var s = '';
			if (data.value == 0 && $("#c_all").is(":checked")) {
				s = 0 + ',';
			} else if ($("#c_all").is(":checked")) {
				s = 0 + ',';
			} else {
				for (var i = 0; i < myaaa.length; i++) {
					if (myaaa[i].checked) s += myaaa[i].value + ',';
				}
			}
			$("#doorNum").attr("value", s.slice(0, s.length - 1))

		});


	});

 2.html页面

<div class="layui-form-item">
				<input type="hidden" name="doorNum" id="doorNum" class="layui-input" lay-verify="required|doorNum"  value="0"/>
				<label class="layui-form-label required" style="width: 145px;">允许通过的门号</label>
				<div class="layui-input-block" style="width:71.5%">
					<input type="checkbox" lay-filter="checkall" name="" id="c_all" title="全选" value="0" checked>
					<tbody>
						<!-- <input type="checkbox" name="ck[0]" class='checkone' title="全选" value="0" > -->
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="一号门" value="1" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="二号门" value="2" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="三号门" value="3" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="四号门" value="4" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="五号门" value="5" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="六号门" value="6" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="七号门" value="7" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="八号门" value="8" checked>
						<input type="checkbox" name="aaa" class='checkone' lay-filter="c_one" title="九号门" value="9" checked>
					</tbody>
				</div>
			</div>
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐