javascript 解决表单仍然提交即使监听处理函数返回false


Posted in Javascript onMarch 14, 2010
<form action="https://3water.com" id="form"> 
<input type="text" /> 
<input type="submit" /> 
</form> 
<script> 
var code = function () { 
return false; 
}; 
var element = window.document.getElementById("form"); 
if (element.addEventListener) { 
element.addEventListener("submit", code, false); 
} 
</script>

修改后的Code:
<form action="https://3water.com" id="form"> 
<input type="text" /> 
<input type="submit" id="btnSubmit" name="btnSubmit" value="Submit" /> 
</form> 
<script> 
var code = function (eventObject) { 
if (eventObject.preventDefault) { 
eventObject.preventDefault(); 
} else if (window.event) /* for ie */ { 
window.event.returnValue = false; 
} 
return true; 
}; 
window.onload = function(){ 
var element = window.document.getElementById("form"); 
if (element.addEventListener) { 
element.addEventListener("submit", code, false); 
} else if (element.attachEvent) { 
element.attachEvent("onsubmit", code); 
} 
} 
</script>

备注:

1:preventDefault函数的使用请参考 https://developer.mozilla.org/en/DOM/event.preventDefault
2:DOM Events :http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event-preventDefault

Javascript 相关文章推荐
JS学习之一个简易的日历控件
Mar 24 Javascript
一个基于jQuery的树型插件(OrangeTree)使用介绍
May 03 Javascript
angularJS提交表单(form)
Feb 09 Javascript
jQuery结合ajax实现动态加载文本内容
May 19 Javascript
Node.js中npm常用命令大全
Jun 09 Javascript
浅谈JS函数定义方式的区别
Oct 30 Javascript
ajax 提交数据到后台jsp页面及页面跳转问题
Jan 19 Javascript
写gulp遇到的ES6问题详解
Dec 03 Javascript
JS阻止事件冒泡的方法详解
Aug 26 Javascript
详解使用mocha对webpack打包的项目进行&quot;冒烟测试&quot;的大致流程
Apr 27 Javascript
Javascript如何递归遍历本地文件夹
Aug 06 Javascript
JavaScript 对象创建的3种方法
Nov 17 Javascript
jQuery第三课 修改元素属性及内容的代码
Mar 14 #Javascript
jQuery 第二课 操作包装集元素代码
Mar 14 #Javascript
jQuery入门第一课 jQuery选择符
Mar 14 #Javascript
使用JavaScript switch case 另类写法
Mar 14 #Javascript
两个JavaScript jsFiddle JSBin在线调试器
Mar 14 #Javascript
input的focus方法使用
Mar 13 #Javascript
JavaScript prototype对象的属性说明
Mar 13 #Javascript
You might like
Content-type 的说明
2006/10/09 PHP
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
PHP中的strtr函数使用介绍(str_replace)
2011/10/20 PHP
Laravel框架路由配置总结、设置技巧大全
2014/09/03 PHP
tp5(thinkPHP5)框架数据库Db增删改查常见操作总结
2019/01/10 PHP
JavaScript 函数惰性载入的实现及其优点介绍
2013/08/12 Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
2013/12/30 Javascript
JavaScript模拟重力状态下抛物运动的方法
2015/03/03 Javascript
jQuery插件zoom实现图片全屏放大弹出层特效
2015/04/15 Javascript
JS实现生成会变大变小的圆环实例
2015/08/05 Javascript
jQuery实现的倒计时效果实例小结
2016/04/16 Javascript
JS定义类的六种方式详解
2016/05/12 Javascript
喜大普奔!jQuery发布 3.0 最终版
2016/06/12 Javascript
js 实现数值的千分位及保存小数方法(推荐)
2016/08/01 Javascript
jQuery简单创建节点的方法
2016/09/09 Javascript
javascript设置文本框光标的方法实例小结
2016/11/04 Javascript
20行js代码实现的贪吃蛇小游戏
2017/06/20 Javascript
使用AngularJS对表单提交内容进行验证的操作方法
2017/07/12 Javascript
Vue实现美团app的影院推荐选座功能【推荐】
2018/08/29 Javascript
JavaScript数据结构与算法之二叉树插入节点、生成二叉树示例
2019/02/21 Javascript
jQuery ajax仿Google自动提示SearchSuggess功能示例
2019/03/28 jQuery
微信小程序结合Storage实现搜索历史效果
2019/05/18 Javascript
vue 如何从单页应用改造成多页应用
2020/10/23 Javascript
python获取局域网占带宽最大3个ip的方法
2015/07/09 Python
简单谈谈Python中的几种常见的数据类型
2017/02/10 Python
Python中字典的浅拷贝与深拷贝用法实例分析
2018/01/02 Python
Python文件时间操作步骤代码详解
2020/04/13 Python
Python:__eq__和__str__函数的使用示例
2020/09/26 Python
Python 实现一个简单的web服务器
2021/01/03 Python
纯css3制作网站后台管理面板
2014/12/30 HTML / CSS
优秀共产党员演讲稿
2014/09/04 职场文书
处级领导班子全部召开专题民主生活会情况汇报
2014/09/27 职场文书
2015年公司后勤管理工作总结
2015/05/13 职场文书
务工证明怎么写
2015/06/18 职场文书
springboot读取nacos配置文件
2022/05/20 Java/Android