<!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. copy_part_stat.sql

    spool 04_copy_part_stat.log conn / as sysdba execute sys.dbms_stats.export_schema_stats(ownname=> ...

  2. Java中关于HashMap的使用和遍历（转）

    Java中关于HashMap的使用和遍历 分类: 算法与数据结构2011-10-19 10:53 5345人阅读 评论(0) 收藏 举报 hashmapjavastringobjectiterator ...

  3. gnome3 no launcher

    http://askubuntu.com/questions/43246/how-to-configure-gnome-3-to-show-icons-on-desktop http://superu ...

  4. PAT 天梯赛 L2-002 链表去重

    模拟单链表的增删操作 题目链接:https://www.patest.cn/contests/gplt/L2-002 题解 最开始我脑抽用map模拟单链表进行操作,因为这样可以节约空间,并且用了cin ...

  5. LVS详解

    v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VM ...

  6. Firebug 非常好用

    chrome 浏览器 火狐 直接获取网页中传输的数据

  7. 3DTouch简单了解

    3D Touch的三大模块 代码Demo:https://github.com/haozheMa/3DTouch 在我们的app中使用3D Touch功能,主要分为以下三个模块: 1.Home Scr ...

  8. C缺陷与陷阱----读书笔记---第一章

    第一章:词法陷阱 编译器中负责将程序分解为一个一个符号的部分,一般称为“词法分析器”.例如,对于语句: if ( x == big ) big = x ; 它的第一个符号是C语言关键字if,紧接着下一 ...

  9. (中等) POJ 3225 Help with Intervals , 线段树+集合。

    Description LogLoader, Inc. is a company specialized in providing products for analyzing logs. While ...

  10. linux pci 协议一

    当当热卖商品推荐 先打下广告,上面是一本好书了O(∩_∩)O~ 前言 因为遇到一个pci总线的问题,所以去学习了解linux 的pci驱动,中间总结了一些pci总线原理和linux驱动的知识,在此总结 ...