浅谈layui 绑定form submit提交表单的注意事项


Posted in Javascript onOctober 25, 2019

如下所示:

<form method="post" class="layui-form">
					<input type="text" name="name" placeholder="用户名" required lay-verify="required" class="layui-input layui-form-danger login-input" >
					<input type="password" name="password" placeholder="密码" required lay-verify="required" class="layui-input layui-form-danger login-input">
					<button class="layui-btn layui-btn-fluid login-btn" lay-submit lay-filter="login" >登录</button>
				</form>
			</div>
			
		</div>
		
		<script type="text/javascript">
 
    $(function () {
      layui.use('form', function(){
       var form = layui.form;
       //监听提交
       form.on('submit(login)', function(data){
        console.log(data);
        return false;
       });
      });
    })
		</script>

绑定button按钮作为提交按钮

1、必须加上lay-submit属性,这个文档没看到具体描述,应该是作为提交按钮的标识

这是文档的介绍

lay-submit 无需填写值 绑定触发提交的元素,如button

2、需要加上lay-filter="标识" 这个属性,这个是layui特有的事件过滤器,个人感觉就是选择器一样

这是文档的介绍

lay-filter 任意字符 事件过滤器(公用属性),主要用于事件的精确匹配,跟选择器是比较类似的。

layui是本人最近学习中的东西,如有说错,欢迎及时留意指出!!

以上这篇浅谈layui 绑定form submit提交表单的注意事项就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js常用排序实现代码
Dec 28 Javascript
ExtJS DOM元素操作经验分享
Aug 28 Javascript
如何实现textarea里的不同文本显示不同颜色
Jan 20 Javascript
Js控制滑轮左右滑动实例
Feb 13 Javascript
JQuery限制复选框checkbox可选中个数的方法
Apr 20 Javascript
js实现用户离开页面前提示是否离开此页面的方法(包括浏览器按钮事件)
Jul 18 Javascript
jquery模拟进度条实现方法
Aug 03 Javascript
JavaScript的==运算详解
Jul 20 Javascript
JavaScript实现经典排序算法之插入排序
Dec 28 Javascript
BootStrap 导航条实例代码
May 18 Javascript
详解vuex commit保存数据技巧
Dec 25 Javascript
简单使用webpack打包文件的实现
Oct 29 Javascript
详解如何在Vue项目中发送jsonp请求
Oct 25 #Javascript
layui实现form表单同时提交数据和文件的代码
Oct 25 #Javascript
vue实现弹幕功能
Oct 25 #Javascript
vue指令v-html使用过滤器filters功能实例
Oct 25 #Javascript
使用layui前端框架弹出form表单以及提交的示例
Oct 25 #Javascript
layui form表单提交后实现自动刷新
Oct 25 #Javascript
jquery实现购物车基本功能
Oct 25 #jQuery
You might like
在smarty中调用php内置函数的方法
2013/02/07 PHP
Centos下升级php5.2到php5.4全记录(编译安装)
2015/04/03 PHP
PHP读取大文件末尾N行的高效方法推荐
2016/06/03 PHP
php读取qqwry.dat ip地址定位文件的类实例代码
2016/11/15 PHP
php使用pecl方式安装扩展操作示例
2019/08/12 PHP
基于PHP实现堆排序原理及实例详解
2020/06/19 PHP
Jquery在指定DIV加载HTML示例代码
2014/02/17 Javascript
jQuery中scrollLeft()方法用法实例
2015/01/16 Javascript
javascript实现控制浏览器全屏
2015/03/30 Javascript
浅谈Javascript中substr和substring的区别
2015/09/30 Javascript
jQuery实现的个性化返回底部与返回顶部特效代码
2015/10/30 Javascript
jquery+ajax实现注册实时验证实例详解
2015/12/08 Javascript
JQuery.validationEngine表单验证插件(推荐)
2016/12/10 Javascript
Bootstrap DateTime Picker日历控件简单应用
2017/03/25 Javascript
angular仿支付宝密码框输入效果
2017/03/25 Javascript
原生JS实现循环Nodelist Dom列表的4种方式示例
2018/02/11 Javascript
vue 开发一个按钮组件的示例代码
2018/03/27 Javascript
微信小程序学习笔记之登录API与获取用户信息操作图文详解
2019/03/29 Javascript
VUE DEMO之模拟登录个人中心页面之间数据传值实例
2019/10/31 Javascript
ng-alain的sf如何自定义部件的流程
2020/06/12 Javascript
nuxt 服务器渲染动态设置 title和seo关键字的操作
2020/11/05 Javascript
Python中urllib2模块的8个使用细节分享
2015/01/01 Python
Python中的index()方法使用教程
2015/05/18 Python
python中字符串前面加r的作用
2015/06/04 Python
python 中的list和array的不同之处及转换问题
2018/03/13 Python
python+PyQT实现系统桌面时钟
2020/06/16 Python
皇马官方商城:Real Madrid Store
2016/09/02 全球购物
越南电子产品购物网站:FPT Shop
2017/12/02 全球购物
师说教学反思
2014/02/07 职场文书
写给老婆的检讨书
2014/02/21 职场文书
绘画专业自荐信范文
2014/02/23 职场文书
巴西世界杯32强口号
2014/06/05 职场文书
考试作弊被抓检讨书
2014/10/02 职场文书
未中标通知书
2015/04/17 职场文书
百善孝为先:关于孝道的经典语录
2019/10/18 职场文书
导游词之寿县报恩寺
2020/01/19 职场文书