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

 更新时间:2019年09月09日 15:32:08   作者:Mirror_Y  
今天小编就为大家分享一篇关于layui表单中按钮自动提交的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

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实现跨浏览器的添加及删除事件绑定函数实例

    这篇文章主要介绍了JavaScript实现跨浏览器的添加及删除事件绑定函数,采用纯javascript实现jquery的bind及unbind添加与删除事件绑定的技巧,具有很好的浏览器兼容性,需要的朋友可以参考下
    2015-08-08
  • JavaScript表单通过正则表达式验证电话号码

    JavaScript表单通过正则表达式验证电话号码

    通过正则表达式实现判断一个输入量是否为电话号码,需要的朋友可以参考下
    2014-03-03
  • 使用JavaScript库还是自己写代码?

    使用JavaScript库还是自己写代码?

    有时候在写JavaScript添加到你的网页中的时候,你将需要决定是使用已有的可用的JavaScript库还是自己写所有代码。其中每个各有优缺点,因此没有任何一种方式对每个人来说都是绝对正确的选择。
    2010-01-01
  • javaScript实现网页版的弹球游戏

    javaScript实现网页版的弹球游戏

    这篇文章主要为大家详细介绍了javaScript实现网页版的弹球游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-07-07
  • 微信小程序实现搜索商品和历史记录的功能

    微信小程序实现搜索商品和历史记录的功能

    这篇文章主要为大家详细介绍了微信小程序实现搜索商品和历史记录的功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • JavaScript之promise_动力节点Java学院整理

    JavaScript之promise_动力节点Java学院整理

    这篇文章主要为大家详细介绍了JavaScript之promise的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 基于JS实现视频上传显示进度条

    基于JS实现视频上传显示进度条

    这篇文章主要介绍了基于JS实现视频上传显示进度条,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-05-05
  • tree shaking功能及使用原理详细解析

    tree shaking功能及使用原理详细解析

    这篇文章主要为大家介绍了tree shaking功能及使用原理详细解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪的相关资料
    2023-01-01
  • js实现时间轴自动排列效果

    js实现时间轴自动排列效果

    本文主要介绍了js实现新增加事件:时间轴自动排列效果的实例,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • JavaScript自定义日期格式化函数详细解析

    JavaScript自定义日期格式化函数详细解析

    下面的一个例子就是以独立函数写出的JavaScript日期格式化函数,独立的format函数。回到格式化的这一知识点上,我们考查的是怎么实现的、运用了哪些原理
    2014-01-01

最新评论