//用一个div把所有的输入框和提交按钮包括起来 并在该div的class中引入"layui-form" <div class="yiBox layui-form"> <div class="tiTxt">网站建议</div> <div class="mingBox "> <input type="text" class="mingput" name="title" placeholder="姓名" /> <input type="text" class="huaput" name="phone" placeholder="联系电话" /> //提交按钮div 中添加lay-filter="user-set-info" lay-submit <div class="subBox" lay-filter="user-set-info" lay-submit>提交</div> </div> <textarea class="tiarea" name="content" placeholder="建议留言"></textarea> </div>
//引入layui.js <script src="/static/layui/layui.js" charset="utf-8"></script> <script> layui.use(function(){ var $ = layui.jquery; var form = layui.form; //根据user-set-info按钮标识获取点击事件 form.on('submit(user-set-info)', function(data){ var field = data.field; $.ajax({ type:'post', //要提交的后台接口地址 url:"{:url('User/add_cunsult')}", data:field, dataType:"json", //接口的返回值存入data变量 success:function(data){ //判断返回值中的code码 if(data.code == 0){ //向页面输出返回值中的msg layer.msg(data.msg,{icon:6,tiye:2000},function(){ //刷新页面 location.reload(); }); } else { layer.open({title:"保存失败",content:data.msg,icon:5,anim:6}); }} }); return false; }); }); </script>
代码分为两部分,第一部分是html用于定义要提交的变量名和提交按钮。第二部分是js部分,引入layer.js监听点击事件,提交数据到接口并处理返回值。