利用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 相关文章推荐
js中文逗号转英文实现
Feb 11 Javascript
jquery无刷新验证邮箱地址实现实例
Feb 19 Javascript
整理Javascript流程控制语句学习笔记
Nov 29 Javascript
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
Jan 12 Javascript
JavaScript sort数组排序方法和自我实现排序方法小结
Jun 06 Javascript
[原创]微信小程序获取网络类型的方法示例
Mar 01 Javascript
小程序组件之自定义顶部导航实例
Jun 12 Javascript
使用react context 实现vue插槽slot功能
Jul 18 Javascript
浅谈vue中组件绑定事件时是否加.native
Nov 09 Javascript
通过高德地图API获得某条道路上的所有坐标用于描绘道路的方法
Aug 24 Javascript
Vue如何实现变量表达式选择器
Feb 18 Vue.js
vue3引入highlight.js进行代码高亮的方法实例
Apr 08 Vue.js
防止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调用Google translate_tts api实现代码
2013/08/07 PHP
PHP独立Session数据库存储操作类分享
2014/06/11 PHP
PHP实现过滤各种HTML标签
2015/05/17 PHP
PHP面向对象之工作单元(实例讲解)
2017/06/26 PHP
PHP简单实现正则匹配省市区的方法
2018/04/13 PHP
php将字符串转换为数组实例讲解
2020/05/05 PHP
use jscript List Installed Software
2007/06/11 Javascript
分享10个原生JavaScript技巧
2015/04/20 Javascript
JavaScript多图片上传案例
2015/09/28 Javascript
JavaScript数据推送Comet技术详解
2016/04/07 Javascript
JavaScript设计模式开发中组合模式的使用教程
2016/05/18 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
2017/01/08 Javascript
通过 JS 判断页面是否有滚动条的实现方法
2018/04/05 Javascript
解决vue跨域axios异步通信问题
2019/04/17 Javascript
Vue 实现一个简单的鼠标拖拽滚动效果插件
2020/12/10 Vue.js
关于python的list相关知识(推荐)
2017/08/30 Python
Python验证文件是否可读写代码分享
2017/12/11 Python
Python基于列表模拟堆栈和队列功能示例
2018/01/05 Python
python实现比较文件内容异同
2018/06/22 Python
influx+grafana自定义python采集数据和一些坑的总结
2018/09/17 Python
python 实现兔子生兔子示例
2019/11/21 Python
简单了解Django ORM常用字段类型及参数配置
2020/01/07 Python
30行Python代码实现高分辨率图像导航的方法
2020/05/22 Python
python3:excel操作之读取数据并返回字典 + 写入的案例
2020/09/01 Python
如何在Cookie里面保存Unicode和国际化字符
2013/05/25 面试题
淘宝客服自我总结鉴定
2014/01/25 职场文书
成绩单公证书
2014/04/10 职场文书
关于环保的标语
2014/06/13 职场文书
2014国庆节幼儿园亲子活动方案
2014/09/16 职场文书
加强干部作风建设整改方案
2014/10/24 职场文书
参加招聘会后的感想
2015/08/10 职场文书
2019财务管理制度最新范本!
2019/07/09 职场文书
甜美蛋糕店的创业计划书模板,拿来即用!
2019/08/21 职场文书
MySQL连接查询你真的学会了吗?
2021/06/02 MySQL
Go中的条件语句Switch示例详解
2021/08/23 Golang
Python使用华为API为图像设置多个锚点标签
2022/04/12 Python