試過所有的辦法，都沒有辦法獲取到復選框的選中狀態，整了一早上，最后忽然想到，難道一定要用layui官方文檔提供的方式監聽嗎，用原生js難道就不行了，最后一試竟然成功了，不得不說，js是最強大的。
1 <div class="myform layui-form"> 2 <input type="text" name="use_type" id="person" value="個人" hidden> 3 <div class="layui-form-item"> 4 <label class="layui-form-label"><b>*</b>姓名：</label> 5 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 6 <input type="text" name="use_name" id="name" required lay-verify="username" placeholder="請輸入姓名" autocomplete="off" class="layui-input"> 7 </div> 8 </div> 9 <div class="layui-form-item"> 10 <label class="layui-form-label"><b>*</b>身份證號：</label> 11 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 12 <input type="text" name="use_card" id="card" required lay-verify="Idcard|identity" placeholder="請輸入身份證號" autocomplete="off" class="layui-input"> 13 </div> 14 </div> 15 <div class="layui-form-item"> 16 <label class="layui-form-label"><b>*</b>密碼：</label> 17 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 18 <input type="password" name="use_password" id="password" required lay-verify="password|passval" placeholder="請輸入密碼" autocomplete="off" class="layui-input"> 19 </div> 20 </div> 21 <div class="layui-form-item"> 22 <label class="layui-form-label"><b>*</b>確認密碼：</label> 23 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 24 <input type="password" name="use_repassword" id="repassword" required lay-verify="rePass" placeholder="請再次輸入密碼" autocomplete="off" class="layui-input"> 25 </div> 26 </div> 27 <div class="layui-form-item"> 28 <label class="layui-form-label"><b>*</b>詳細地址：</label> 29 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 30 <select name="use_address" id="provice" lay-verify="address" style="width: 49%;"> 31 <option value="">請選擇所在省/市</option> 32 <option value="0">北京</option> 33 <option value="1">上海</option> 34 <option value="2">廣州</option> 35 <option value="3">深圳</option> 36 <option value="4">杭州</option> 37 </select> 38 <select name="use_adddress" id="city" lay-verify="address" > 39 <option value="">請選擇所在市/區</option> 40 <option value="0">北京</option> 41 <option value="1">上海</option> 42 <option value="2">廣州</option> 43 <option value="3">深圳</option> 44 <option value="4">杭州</option> 45 </select> 46 <textarea name="use_address" id="detailaddress" placeholder="請輸入詳細地址" lay-verify="address" class="layui-textarea"></textarea> 47 </div> 48 </div> 49 <div class="layui-form-item"> 50 <label class="layui-form-label"><b>*</b>手機號碼：</label> 51 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 52 <input type="text" name="use_telephone" id="telephone" required lay-verify="telephone|phone" placeholder="請輸入手機號碼" autocomplete="off" class="layui-input"> 53 </div> 54 </div> 55 <div class="layui-form-item "> 56 <label class="layui-form-label"><b>*</b>驗證碼：</label> 57 <div class="layui-input-block layui-col-md5 layui-col-sm6 "> 58 <input type="text" name="use_vcode" id="vcode" required lay-verify="code" placeholder="請輸入驗證碼" autocomplete="off" class="myInput" > 59 <a href="#"> <input type="button" class="mybtn" value="獲取手機驗證碼"/></a> 60 </div> 61 </div> 62 <div class="layui-form-item layui-col-md5 layui-col-md-offset2 layui-col-sm-offset3"> 63 <input type="checkbox" name="protocol" value="0" id="key_service" lay-skin="primary" lay-verify="check" title="創建網站賬號的同時，我同意遵守："> 64 <p style="padding-left:20px"><a href="#"><b>《服務條款》</b></a>及<a hrefe="#"><b>《隱私聲明》</b></a></p> 65 66 </div> 67 <div class="layui-form-item layui-col-md-offset2 layui-col-sm-offset3" > 68 <div class="layui-input-block layui-col-md5 layui-col-sm6"> 69 <button class="layui-btn" lay-submit lay-filter="formDemo" style="background: #ff6666;width: 100%;">同意並注冊</button> 70 </div> 71 </div> 72 </div>
1 layui.use(['layer','form','laydate'], function(){ 2 var form = layui.form,laydate=layui.laydate,layer=layui.layer; 3 var $=layui.$; 4 form.render(); 5 /*對前台信息進行校驗*/ 6 form.verify({ 7 username:function (value,item) { 8 if(value==""){ 9 return "請輸入真實姓名"; 10 } 11 }, 12 Idcard:function (value,item) { 13 if(value==""){ 14 return "請輸入身份證號" 15 } 16 17 }, 18 password:function (value,item) { 19 if(value==""){ 20 return "請輸入密碼" 21 } 22 }, 23 passval:[ 24 /^[\S]{6,12}$/ 25 ,'密碼必須6到12位，且不能出現空格' 26 ], 27 rePass:function (value,item) { 28 if(value!=$("#password").val()){ 29 return "兩次輸入的密碼不一致" 30 } 31 }, 32 address:[ 33 /[\S]+/, 34 '請選擇並輸入詳細地址' 35 ], 36 telephone:[ 37 /[\S]+/, 38 '請輸入電話號碼' 39 ], 40 code:[ 41 /[\S]+/, 42 '請輸入驗證碼' 43 ],check:function () { 44 var checked=document.getElementById("key_service"); 45 if(checked.checked==false){ 46 layer.msg("請勾選協議",{icon:5,time:2000,anim: 6}) 47 } 48 } 49 50 51 }); 52 //監聽提交 53 form.on('submit(formDemo)', function(data){ 54 55 $.ajax({ 56 url:'test.html', 57 method:'post', 58 data:data.field, 59 dataType:'JSON', 60 success:function (res) { 61 if(res.code='0'){ 62 parent.closeIframe(res.msg); 63 }else{ 64 alert(res.msg); 65 } 66 }, 67 error:function (data) { 68 69 } 70 }); 71 //return false; 72 73 // layer.msg(JSON.stringify(data.field)); 74 return false; 75 }); 76 });
在form.verify中定義的規則，直接在表單中lay-filter中引用就可以了，例如：
<input type="password" name="use_password" id="password" required lay-verify="password|passval" placeholder="請輸入密碼" autocomplete="off" class="layui-input">