表单数据这一块 layui 做的是真的不好,无论是在渲染还是在交互方面,每次都要自己来重新实现代码
#贴上代码
<!DOCTYPE HTML><head> <Meta charset="utf-8"> <Title>Layui 监听 复选框 提价表单</Title> <link rel="stylesheet" type="text/CSS" href="//layui.hcwl520.com.cn/layui/CSS/layui.CSS?v=201801090202"/></head><body><form class="layui-form p-3" autocomplete="off" οnsubmit="return false"> <div class="layui-form-item"> <label class="layui-form-label">复选框</label> <div class="layui-input-inline"> <input type="text" name="number" value="0,1,3,4,5,6," Disabled> <input type="checkBox" lay-filter="number" lay-skin="primary" value="0" Title="0"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="1" Title="1"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="2" Title="2"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="3" Title="3"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="4" Title="4"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="5" Title="5"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="6" Title="6"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="7" Title="7"> <input type="checkBox" lay-filter="number" lay-skin="primary" value="8" Title="8"> </div> </div></form><script src="//layui.hcwl520.com.cn/layui/layui.Js?v=201801090202"></script><script> layui.use([‘form‘,‘laydate‘],function () { var $ = layui.$//Jquery,form = layui.form;//表单 //页面加载的时候就初始几个值 initValue(); //监听复选框 form.on(‘checkBox(number)‘,function (data) { var number = $(‘input[name="number"]‘),value = data.value,array = number.val().split(","); if (data.elem.checked) { number.val(number.val() + value + ","); } else { var newnumber = ""; for (var i = 0; i < array.length; i++) { var str = array[i]; newnumber += (str != value && str != "" && str != null) ? str + "," : ""; } number.val(newnumber); } }); /** * input 框初始 赋值 到checkedBox上 * @author lengff */ function initValue() { var param=$("input[name=‘number‘]").val(),checkBoxs = $("input[type=‘checkBox‘]"),array = param.split(","); for (var i = 0; i < array.length; i++) { for (var j = 0; j < checkBoxs.length; j++) { var checkBox = $(checkBoxs[j]); if (checkBox.val() == array[i]) { checkBox.attr(‘checked‘,‘checked‘); break; } } } form.render(‘checkBox‘); } });</script></body></HTML>总结
以上是内存溢出为你收集整理的Layui 监听 复选框 提交表单全部内容，希望文章能够帮你解决Layui 监听 复选框 提交表单所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）