防止IE重复提交表单处理时,遇到的按钮操作问题

编程技术  /  houtizong 发布于 3年前   88
需求很简单,无非是防止用户频繁点击表单,以及ajax提交,不要给用户“点击之后,没有任何反应”的错觉。
因此在表单提交按钮点击之后,作如下效果:
按钮失效,背景变成灰色,并且在按钮后面加一个loading的小图标。

因为表单中还有一些非空字段的校验,所以上述效果的代码只有在校验全部通过的时候运行才是正常的。

起初我是在submit按钮上添加了一个,onclick事件,为了使这个按钮在提交时候失效,我添加了下面这一行代码
  $("#submit_button").attr("disabled","disabled");

火狐下面运行这个代码是没有任何问题的,后台的ajax提交也是很顺利,提交之后这个按钮变成灰色并且点击无效
但是IE下面是不行的,IE下面这样的代码只是按钮失效,并没有Ajax的后台提交

经过测试研究,最后发现是IE这个事件的执行顺序问题,把相关代码注册到form表单onsubmit事件上,即可在IE和狐火下面全部通过测试。

请勿发布不友善或者负能量的内容。与人为善,比聪明更重要!

留言需要登陆哦

技术博客集 - 网站简介:
前后端技术:
后端基于Hyperf2.1框架开发,前端使用Bootstrap可视化布局系统生成

网站主要作用:
1.编程技术分享及讨论交流,内置聊天系统;
2.测试交流框架问题,比如:Hyperf、Laravel、TP、beego;
3.本站数据是基于大数据采集等爬虫技术为基础助力分享知识,如有侵权请发邮件到站长邮箱,站长会尽快处理;
4.站长邮箱:[email protected];

      订阅博客周刊 去订阅

文章归档

文章标签

友情链接

Auther ·HouTiZong
侯体宗的博客
© 2020 zongscan.com
版权所有ICP证 : 粤ICP备20027696号
PHP交流群 也可以扫右边的二维码
侯体宗的博客