<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title>runcode</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Author" content="Sheneyan" />
<head>
<script type="text/javascript">
function form1(){
event.returnValue = false;
}
function form2(){
return false;
}
</script>
</head>
<body>
<form onsubmit="form1()"> <!-- 1 -->
<fieldset><legend>event.returnValue = false</legend> <input
type="submit" /></fieldset>
</form>
<form onsubmit="return form2()"> <!-- 2 -->
<fieldset><legend>return false的正确用法</legend> <input
type="submit" /></fieldset>
</form>
<form onsubmit="form2()"> <!-- 3 -->
<fieldset><legend>return false的错误用法</legend> <input
type="submit" /></fieldset>
</form>
</body>
</html>

三个提交的onsubmit属性都是想让表单提交之前验证,验证失败则不提交表单。第一、二两处做到了,第三出没做到。

这个只有运行起来才能看到结果

1处,表单没有提交

2处,表单没有提交

3处,表单提交了。这不是希望的

event.returnValue的作用就是:当捕捉到事件(event)时,做某些判断,如果判断失败,则阻止当前事件继续运行,这样讲您也许还不是特别理解,我再举一个例子,该例子达到的效果是:不能在一个输入框中输入小数。

FireFox浏览器:

<script language="javascript" type="text/javascript">
function test(event)
{
if(event.charCode == 46)
{
event.preventDefault();
}
}
</script> <input type="text" onkeypress="test(event)"/>

IE浏览器:

<script language="javascript" type="text/javascript">
function test()
{
if(event.keyCode == 46)
{
event.returnValue = false;
}
} <input type="text" onkeypress="test()"/>

请注意两种浏览器的不同之处,在FireFox中event必须作为test()函数的如参传入,而IE不用,这个我在《JavaScript高级程序设计》一书中P233页,9.4.1章节找到如下答案:

9.4 事件对象

...

你也许已经猜到,IE和DOM是用两种不同的方法实现事件对象的。

9.4.1

在IE中,事件对象是window对象的一个属性event。也就是说,事件处理函数必须这样访问事件对象:

oDiv.onclick = function()
{
var oEvent = window.event;
}

尽管它是window对象的属性,event对象还是只能在事件发生时访问。所有的事件处理函数执行完毕后,事件对象就被销毁。

DOM 标准则说,event对象必须作为唯一的参数传给事件处理函数。所以,在DOM兼容的浏览器(如:Mozilla,Safari和Opera)中访问事件对象,要这么做:

oDiv.onclick = function
{
var oEvent = arguments[0];
...
} 当然,可以直接命名参数,访问就更方便了:
oDiv.onclick = function(oEvent)
{
...
}

event.returnValue和return false的区别的更多相关文章

  1. 解读event.returnValue和return false

    前言 首先我们要清楚returnValue是IE的一个属性,如果设置了该属性,它的值比事件句柄的返回值优先级要高,把它的值设置为false,可以取消发生事件源元素的默认动作:return false就 ...

  2. event.stopPropagation(),event.preventDefault()和return false的区别

    event.stopPropagation(),event.preventDefault()和return false的区别 1.event.stopPropagation()方法 这是阻止事件的冒泡 ...

  3. event.stopPropagation()、event.preventDefault()与return false的区别

    做小demo时经常用到return false来取消默认事件,但一直不是很懂它和preventDefault()等的区别,今天查了查文档和大神们的博客,在这里对相关知识点做一个总结 首先开门见山,总结 ...

  4. JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

    在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时 ...

  5. 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

    1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...

  6. event.stopPropagation()和event.preventDefault(),return false的区别

    我写公司的官网遇到一个问题,轮播图的上一层有一块内容,用鼠标拖动那块内容的时候下一层的轮播图也会跟着拖动,而上面的那层的内容是不会动的,我想这就是冒泡事件在作祟了吧 跟冒泡事件相关的,我想到三个: 1 ...

  7. 【前端】stopPropagation, preventDefault, return false的区别

    e.stopPropagation()阻止事件冒泡或者捕获 因为事件可以在各层级的节点中传递, 不管是冒泡还是捕获, 有时我们希望事件在特定节点执行完之后不再传递, 可以使用事件对象的 stopPro ...

  8. 原生js使用forEach()与jquery使用each遍历数组,return false 的区别

    原生js使用forEach()与jquery使用each()遍历数组,return false 的区别: 1.使用each()遍历数组a,如下: var a=[20,21,22,23,24]; $.e ...

  9. 阻止事件冒泡两种方式:event.stopPropagation();和return false;

    jQuery提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function (event) { ...

随机推荐

  1. spider JAVA如何判断网页编码 (转载)

    原文链接 http://www.cnblogs.com/nanxin/archive/2013/03/27/2984320.html 前言 最近做一个搜索项目,需要爬取很多网站获取需要的信息.在爬取网 ...

  2. Fragment和Activity(转)

    Android Fragment和Activity Fragment和Activity Fragment和Activity的交互 一个Fragment的实例总是和包含它的Activity直接相关. f ...

  3. ural1494 Monobilliards

    Monobilliards Time limit: 1.0 secondMemory limit: 64 MB A monobilliards table set up in a gaming hou ...

  4. [算法] aov图拓扑算法

    #include <stdio.h> #include <string.h> #include <stdlib.h> #include <queue> ...

  5. 打印等腰三角形javascript

    <html> <head> <script type="text/javascript"> var n=4;//层数 for(var i=1; ...

  6. iOS关于UITabView和UIAlertController,UIAlertAction以及UINavigation,值修改的传递页面推送

    关于UITabView和UIAlertController,UIAlertAction以及UINavigation,值修改的传递 集合嵌套集合的操作 声明 两个必须的的代理 实现部分代码 - (voi ...

  7. Lua学习系列(三)

    Ubuntu14.04 上源码编译安装lua5.3 原文:http://blog.csdn.net/abclixu123/article/details/46676991

  8. 前台html与后台php通信(上传文件)

    这部分为导入txt文本文件,存放在服务器然后返回txt文本的内容到前台进行相应操作 前台html代码 <div id="coordinate_div">         ...

  9. 所有事件event集锦

    'mousedown touchstart', 'mousemove touchmove', 'mouseup mouseleave touchend touchleave touchcancel', ...

  10. Lumen 配置、重写、404错误等

    1.权限是否有设置为777: 2.app key是否有设置: 3.apache下是否有开启重写,a2enmod: 4.nginx下server的location是否配置正确,重写规则有没添加,rout ...