坑的外观
最近用了一段时间 Layui 作为项目后台管理模块的前端框架, 感觉还是挺好用的.
今天踩了个坑, 就是使用 layui 表单提交时, 提交的数据为空.
例如, layer.msg(JSON.stringify(data.field)); 这句代码执行后, 页面显示为空对象.
- <form class="layui-form" action="">
- <div class="layui-form-item">
- <label class="layui-form-label"> 输入框 </label>
- <div class="layui-input-block">
- <input type="text" id="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
- </div>
- </div>
- </form>
- layui.use('form', function(){
- var form = layui.form;
- // 监听提交
- form.on('submit(formDemo)', function(data){
- layer.msg(JSON.stringify(data.field));// 此处显示输入内容
- return false;
- });
- });
坑的原因
想了半天都没弄明白, 最后仔细对比了示例源码和自己的代码, 原来是人家 Layui 提交表单时是按元素的 name 和 value 准备数据的, 而我为了使用 jQuey 处理元素方便, 把 name 改为 id.
就是这个:<input type="text" id="title"
改为 < input type="text" id="title" name="title" 后, 问题解决.
来源: http://www.jb51.net/article/145679.htm