利用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 相关文章推荐
基于jQuery的js分页代码
Jun 10 Javascript
jquery中使用ajax获取远程页面信息
Nov 13 Javascript
国外大牛IE版本检测!现在IE都到9了,IE检测代码
Jan 04 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
Aug 14 Javascript
js获取当前页面路径示例讲解
Jan 08 Javascript
javascript实现滑动解锁功能
Dec 31 Javascript
JS清除选择内容的方法
Jan 29 Javascript
jQuery Tree Multiselect使用详解
May 02 jQuery
jQuery实现动态删除LI的方法
May 30 jQuery
关于使用axios的一些心得技巧分享
Jul 02 Javascript
node使用mysql获取数据库数据中文乱码问题的解决
Dec 02 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
Aug 08 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 数字左侧自动补0
2008/03/31 PHP
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
phpQuery让php处理html代码像jQuery一样方便
2015/01/06 PHP
php去除二维数组的重复项方法
2015/11/03 PHP
基于PHP实现用户注册登录功能
2016/10/14 PHP
php在windows环境下获得cpu内存实时使用率(推荐)
2018/02/08 PHP
PHP实现数组根据某个单元字段排序操作示例
2018/08/01 PHP
Prototype ObjectRange对象学习
2009/07/19 Javascript
让textarea自动调整大小的js代码
2011/04/12 Javascript
js获取URL的参数的方法(getQueryString)示例
2013/09/29 Javascript
JQuery与JS里submit()的区别示例介绍
2014/02/17 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
2015/08/12 Javascript
jQuery实现Tab选项卡切换效果简单演示
2015/11/23 Javascript
简单的js计算器实现
2016/10/26 Javascript
js学习总结之DOM2兼容处理重复问题的解决方法
2017/07/27 Javascript
vue刷新页面时去闪烁提升用户体验效果的实现方法
2018/12/10 Javascript
vue draggable resizable gorkys与v-chart使用与总结
2019/09/05 Javascript
vue-video-player实现实时视频播放方式(监控设备-rtmp流)
2020/08/10 Javascript
详解Python中的序列化与反序列化的使用
2015/06/30 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
详解Python_shutil模块
2019/03/15 Python
树莓派实现移动拍照
2019/06/22 Python
django模型动态修改参数,增加 filter 字段的方式
2020/03/16 Python
django template实现定义临时变量,自定义赋值、自增实例
2020/07/12 Python
Unineed旗下时尚轻奢网站:FABHunt
2019/05/13 全球购物
德国家具购物网站:Möbel Höffner
2019/08/26 全球购物
在校生汽车维修实习自我鉴定
2013/09/19 职场文书
《三袋麦子》教学反思
2014/03/02 职场文书
人力资源管理专业自荐信
2014/06/24 职场文书
护林防火标语
2014/06/27 职场文书
离婚案件答辩状
2015/05/22 职场文书
大学生活委员竞选稿
2015/11/21 职场文书
导游词之长城八达岭
2019/09/24 职场文书
python实战之用emoji表情生成文字
2021/05/08 Python
Windows Server 2012配置DNS服务器的方法
2022/04/29 Servers
Python循环之while无限迭代
2022/04/30 Python