利用JavaScript阻止表单提交的两种方法


Posted in Javascript onAugust 11, 2016

在JavaScript中,阻止表单默认提交行为的方法有两种,分别是:

(1) return false

示例代码

<form name="loginForm" action="login.aspx" method="post">
 <button type="submit" value="Submit" id="submit">Submit</button>
</form>

<script>
 var submitBtn = document.getElementById("submit");

 submitBtn.onclick = function (event) {
  alert("preventDefault!");
  return false;
 };
</script>

(2) 使用preventDefault()

在标准浏览器中,阻止浏览器默认行为使用event.preventDefault(),而在IE6~8中,使用returnValue属性来实现。

示例代码

<form name="loginForm" action="login.aspx" method="post">
 <button type="submit" value="Submit" id="submit">Submit</button>
</form>

<script>
 var submitBtn = document.getElementById("submit");

 submitBtn.onclick = function (event) {
  alert("preventDefault!");
  var event = event || window.event;
  event.preventDefault(); // 兼容标准浏览器
  window.event.returnValue = false; // 兼容IE6~8
 };
</script>

以上就是利用JavaScript来阻止表单提交的两种方法的全部内容,希望本文的内容对大家使用JavaScript有所帮助。

Javascript 相关文章推荐
javascript 哈希表(hashtable)的简单实现
Jan 20 Javascript
简单的邮箱登陆的提示效果类似于yahoo邮箱
Feb 26 Javascript
js点击选择文本的方法
Feb 09 Javascript
jQuery基于ajax实现带动画效果无刷新柱状图投票代码
Aug 10 Javascript
JS实现带提示的星级评分效果完整实例
Oct 30 Javascript
深入理解bootstrap框架之第二章整体架构
Oct 09 Javascript
jQuery实现的模拟弹出窗口功能示例
Nov 24 Javascript
js实现适配不同的屏幕大小
Apr 10 Javascript
vue-cli webpack 开发环境跨域详解
May 18 Javascript
vue用递归组件写树形控件的实例代码
Jul 19 Javascript
在小程序中推送模板消息的实现方法
Jul 22 Javascript
解决Vue的文本编辑器 vue-quill-editor 小图标样式排布错乱问题
Aug 03 Javascript
防止Node.js中错误导致进程阻塞的办法
Aug 11 #Javascript
JavaScript中 ES6 generator数据类型详解
Aug 11 #Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合
Aug 11 #Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(一)之数据支持json字符串、list集合
Aug 11 #Javascript
jQuery的图片轮播插件PgwSlideshow使用详解
Aug 11 #Javascript
jQuery 翻页组件yunm.pager.js实现div局部刷新的思路
Aug 11 #Javascript
jQuery多个版本和其他js库冲突的解决方法
Aug 11 #Javascript
You might like
用PHP动态创建Flash动画
2006/10/09 PHP
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
PHP检测移动设备类mobile detection使用实例
2014/04/14 PHP
PHP实现手机号码中间四位用星号(*)隐藏的自定义函数分享
2014/09/27 PHP
PHPStrom中实用的功能和快捷键大全
2015/09/23 PHP
php微信公众号开发之微信企业付款给个人
2018/10/04 PHP
Aster vs Newbee BO3 第三场2.18
2021/03/10 DOTA
js 字符串操作函数
2009/07/25 Javascript
jquery validation插件表单验证的一个例子
2010/03/03 Javascript
Jquery 获取checkbox的checked问题
2011/11/16 Javascript
jquerymobile checkbox及时刷新才能获取其准确值
2012/04/14 Javascript
javascript动画对象支持加速、减速、缓入、缓出的实现代码
2012/09/30 Javascript
javascript读写json示例
2014/04/11 Javascript
javascript去除字符串左右两端的空格
2015/02/05 Javascript
JavaScript设计模式初探
2016/01/07 Javascript
AngularJS创建自定义指令的方法详解
2016/11/03 Javascript
JS闭包的几种常见形式实例详解
2017/09/16 Javascript
jQuery中extend函数简单用法示例
2017/10/11 jQuery
layui点击导航栏刷新tab页的示例代码
2018/08/14 Javascript
Vue.directive使用注意(小结)
2018/08/31 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
2018/09/03 Javascript
vue 内置过滤器的使用总结(附加自定义过滤器)
2018/12/11 Javascript
JS实现图片轮播效果实例详解【可自动和手动】
2019/04/04 Javascript
[02:55]DOTA2英雄基础教程 发条技师
2013/12/04 DOTA
[02:28]DOTA2亚洲邀请赛附加赛 RECAP赛事回顾
2015/01/29 DOTA
Python中类的继承代码实例
2014/10/28 Python
python对象与json相互转换的方法
2019/05/07 Python
如何基于Python获取图片的物理尺寸
2019/11/25 Python
python根据用户需求输入想爬取的内容及页数爬取图片方法详解
2020/08/03 Python
CSS3 实现雷达扫描图的示例代码
2020/09/21 HTML / CSS
党员培训思想汇报
2014/01/07 职场文书
护士进修自我鉴定
2014/02/07 职场文书
2014银行领导班子群众路线对照检查材料思想汇报
2014/09/17 职场文书
2015年信贷员工作总结
2015/04/28 职场文书
党员理论学习心得体会
2016/01/21 职场文书
撤回我也能看到!教你用Python制作微信防撤回脚本
2021/06/11 Python