2021-05-08

关于layui的学习笔记–button按钮在form表单外面如何进行提交

方法一：
通过点击直接获取form中所有的值
layui.$(#demo).on(‘click’,function(){…});

方法二：
在表单里添加一个隐藏提交按钮，当点击外部表单时来触发内部表单的点击操作。具体实现就不做过多的介绍了。

方法三：
就是重点介绍的，今天做项目的时候忽然发现一个比较有意思的事，那就是form表单的预设元素属性lay-submit,利用这个属性做了个简单的测试：

<form action="xxx" class="layui-form">
	<label>关键字 :</label>
    <div class="layui-inline" style="margin-right: 10px;width:500px">
    	<input type="text" name="information" placeholder="请输入相关信息" autocomplete="off" class="layui-input">
     </div>
     <button  class="layui-btn" lay-submit  lay-filter="searchForm"><i class="layui-icon">&#xe615;</i> 查询</button>
</form>

<table class="layui-hide" id="table" lay-filter="table"></table>
<button type="button" lay-submit lay-filter="zzz" class="layui-btn layui-btn-sm layui-btn-normal">提交</button>

要注意的是form表单里的lay-submit可要可不要，去掉对使用form.on(‘event(过滤器值)’, callback);没有什么影响；表单外的加了lay-submit属性的不能够删除，加了这个预设属性，这个按钮就可以自动与表单进行绑定，然后就可以使用表单的监听语法了，如果删除掉的话，那么就不能够使用layui表单自带的事件触发语法了。