关于layui表单中按钮自动提交的解决方法


Posted in Javascript onSeptember 09, 2019

layui表单中的按钮会自动提交,这是一个很麻烦的事情。

这几天项目中多次用到表单按钮,仔细研究了下,找到了解决方法:

1、如果不需要放在表单中的按钮,最好不要放在表单中,不在layui的form中的按钮就不会进行自动提交了;

2、放在表单中的按钮可以通过js中的回调函数里添加 return false制止。filter中的参数指的是按钮中的lay-filter属性中的值,这个可以自己随便设。

比如:

form.on('submit(filter)',function(data){
  ......
  return false;
});

但是,这里有一个很容易忽视的问题:如果按钮中没有添加lay-submit属性,layui的form.on的表单提交监听不到这个按钮,那么return false对提交的制止也就失效了。

3、还有一种方法,就是使用a标签做成的按钮来替代button。

````````````````````````````````````````````````````````````````````````````````

4、感谢评论区大佬的指正:

button的type设置为button就不会自动提交,默认是submit,此时就会自动提交。

以上这篇关于layui表单中按钮自动提交的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript单元测试ABC
Apr 12 Javascript
使用JavaScript进行进制转换将字符串转换为十进制
Sep 21 Javascript
node+express+jade制作简单网站指南
Nov 26 Javascript
KnockoutJS 3.X API 第四章之数据控制流foreach绑定
Oct 10 Javascript
深入理解Node.js的HTTP模块
Oct 12 Javascript
BootstrapValidator超详细教程(推荐)
Dec 07 Javascript
vue观察模式浅析
Sep 25 Javascript
Vue组件Draggable实现拖拽功能
Dec 01 Javascript
js中let能否完全替代IIFE
Jun 15 Javascript
Vue打包后访问静态资源路径问题
Nov 08 Javascript
Javascript操作select控件代码实例
Feb 14 Javascript
js实现无限层级树形数据结构(创新算法)
Feb 27 Javascript
layui原生表单验证的实例
Sep 09 #Javascript
layui的表单提交以及验证和修改弹框的实例
Sep 09 #Javascript
layui插件表单验证提交触发提交的例子
Sep 09 #Javascript
Node.js之删除文件夹(含递归删除)代码实例
Sep 09 #Javascript
layer.confirm点击第一个按钮关闭弹出框的方法
Sep 09 #Javascript
微信小程序 wx:for遍历循环使用实例解析
Sep 09 #Javascript
layer关闭当前窗口页面以及确认取消按钮的方法
Sep 09 #Javascript
You might like
Android App中DrawerLayout抽屉效果的菜单编写实例
2016/03/21 PHP
PHP实现一个多功能购物网站的案例
2017/09/13 PHP
PHP实现的多维数组排序算法分析
2018/02/10 PHP
javascript之更有效率的字符串替换
2008/08/02 Javascript
用js实现层随着内容大小动态渐变改变 推荐
2009/12/19 Javascript
JQury slideToggle闪烁问题及解决办法
2011/07/05 Javascript
基于jquery的弹出提示框始终处于窗口的居中位置(类似于alert弹出框的效果)
2011/09/28 Javascript
uploadify 3.0 详细使用说明
2012/06/18 Javascript
温习Javascript基础语法之词法结构
2016/05/31 Javascript
基于angular中的重要指令详解($eval,$parse和$compile)
2016/10/21 Javascript
vue.js+Element实现表格里的增删改查
2017/01/18 Javascript
Angular中响应式表单的三种更新值方法详析
2017/08/22 Javascript
微信小程序实现点击文字页面跳转功能【附源码下载】
2017/12/12 Javascript
js实现二级菜单点击显示当前内容效果
2018/04/28 Javascript
React 源码中的依赖注入方法
2018/11/07 Javascript
Vue实现简单计算器案例
2020/02/25 Javascript
vue或react项目生产环境去掉console.log的操作
2020/09/02 Javascript
JS如何实现在弹出窗口中加载页面
2020/12/03 Javascript
[05:36]DOTA2 2015国际邀请赛中国区预选赛第四日TOP10
2015/05/29 DOTA
调试Python程序代码的几种方法总结
2015/04/28 Python
python爬取51job中hr的邮箱
2016/05/14 Python
Python基于csv模块实现读取与写入csv数据的方法
2018/01/18 Python
python3.4控制用户输入与输出的方法
2018/10/17 Python
Django中URL的参数传递的实现
2019/08/04 Python
python加载自定义词典实例
2019/12/06 Python
jupyter notebook中新建cell的方法与快捷键操作
2020/04/22 Python
荷兰网上鞋店:Ziengs.nl
2017/01/02 全球购物
Eclipse面试题
2014/03/22 面试题
导航工程专业自荐信
2014/09/02 职场文书
党员专题组织生活会发言材料
2014/10/17 职场文书
2014年信访工作总结
2014/11/17 职场文书
会议通知格式范文
2015/04/15 职场文书
劳动者解除劳动合同通知书
2015/04/16 职场文书
《春酒》教学反思
2016/02/22 职场文书
导游词之云南丽江古城
2019/09/17 职场文书
HTML5之高度塌陷问题的解决
2022/06/01 HTML / CSS