一直听说jquery中事件函数返回false，相当于调用了event.preventDefault()和event.stopPropagation()两个方法，
今天就想看看dom中0级、1级、2级事件绑定事件的话，事件函数返回false会是个什么情况，看看是不是和jquery一个样；
<!doctype html>
<html>
        <head>
                <meta charset='utf-8' />
                <script>
                        function a(){
                                console.log("body");
                        }
                        
                        function b(event){
                                console.log("div");
                                return false;
                        }
                </script>
        </head>
        <body onclick='a();'>
                <a style='width:200px;height:200px;background:red;display:block;' href='http://www.baidu.com' onclick='return b();'>aaaa</a>
        </body>
</html>
运行之后发现打印div和body,但是不会跳转到百度，所以0级dom事件的return false只是阻止了默认事件，和jquery 的不同

再来看看1级dom事件
<!doctype html>
<html>
        <head>
                <meta charset='utf-8' />
                <script>
                        function a(){
                                console.log("body");
                        }
                        
                        function b(event){
                                console.log("div");
                                return false;
                        }
                        function load(){
                                document.body.onclick = a;
                                document.getElementsByTagName("a")[0].onclick = b;
                        }
                </script>
        </head>
        <body onload='load();'>
                <a style='width:200px;height:200px;background:red;display:block;' href='http://www.baidu.com'>aaaa</a>
        </body>
</html>
运行之后发现打印div和body,但是不会跳转到百度，所以1级dom事件的0级dom事件函数中的return false含义一样，只是阻止了默认事件，和jquery 的不同

再来看看2级dom事件
<!doctype html>
<html>
        <head>
                <meta charset='utf-8' />
                <script>
                        function a(){
                                console.log("body");
                        }
                        
                        function b(event){
                                console.log("div");
                                return false;
                        }
                        function load(){
                                document.body.addEventListener("click",a,false);
                                document.getElementsByTagName("a")[0].addEventListener("click",b,false);
                        }
                </script>
        </head>
        <body onload='load();'>
                <a style='width:200px;height:200px;background:red;display:block;' href='http://www.baidu.com'>aaaa</a>
        </body>
</html>
运行之后发现打印div和body,并且会跳转到百度，所以2级dom事件函数中的return false什么事情也没做，和jquery不同

jquery事件函数和原生事件绑定函数中return false的区别的更多相关文章

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

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

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

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

  3. JAVASCRIPT事件详解-------原生事件基础....

    javaScirpt事件详解-原生事件基础(一)   事件 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间,通过监听特定事件的发生,你能 ...

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

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

  5. js中return false; jquery中需要这样写：return false(); Jquery 中循环 each的用法 for循环

    js中return false; jquery中需要这样写:return false(); Jquery 中循环 each的用法 $(".progressName").each(f ...

  6. javaScirpt事件详解-原生事件基础（一）

    事件 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间,通过监听特定事件的发生,你能响应相关的操作.图片引用:UI Events 事件流 ...

  7. jQuery js 中return false,e.preventDefault(),e.stopPropagation()的区别(事件冒泡)

    有时候遇到冒泡事件很烦人,真的..... 1.e.stopPropagation()阻止事件冒泡 <head> <title></title> <script ...

  8. javascript事件中'return false'详解

    浏览器中有很多异步事件,如click,mouseenter,mouseover等等,当用户执行相应操作之后,触发这个事件,然后执行相应的事件处理函数,一般情况下,我们可以通过三种方式给元素添加事件处理 ...

  9. 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return fal的区别

    今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...

随机推荐

  1. SPRING IN ACTION 第4版笔记-第九章Securing web applications-010-拦截请求

    一. What if you wanted to restrict access to certain roles only on Tuesday? Using the access() method ...

  2. 126. Word Ladder II

    题目: Given two words (beginWord and endWord), and a dictionary's word list, find all shortest transfo ...

  3. ConfigurationManager配置操作

    /// <summary> /// 配置信息维护 /// </summary> public class AppConfig { public static Configura ...

  4. 如何利用python使用libsvm

    一:libsvm包下载与使用:      LIBSVM是台湾大学林智仁(Lin Chih-Jen)副教授等开发设计的一个简单.易于使用和快速有效的SVM模式识别与回归的软件包,他不但提供了编译好的可在 ...

  5. Windows平台下的session0创建进程的问题与解决办法

    很多博客都有记载如何在session0下创建进程的办法,也就是使用CreateProcessAsUser.但是这个要求服务的进程有SE_INCREASE_QUOTA_NAME和SE_ASSIGNPRI ...

  6. dom4j 的小小测试

    @Test public void gogo() throws IOException{ InputStream in = this.getClass().getClassLoader() .getR ...

  7. 开源布局控件 WeifenLuo.WinFormsUI.Docking.dll使用

    WeifenLuo.WinFormsUI.Docking是一个很强大的界面布局控件,可以保存自定义的布局为XML文件,可以加载XML配置文件.! 先看一下效果 使用说明: 1.新建一个WinForm程 ...

  8. linux bash脚本把A和B文件中有相同ID的B文件的内容输出到文件C

    bash脚本把A和B文件中有相同ID的B文件的内容输出到文件C. Aid文件:ID001.1ID032.1ID090.10 Bfilt文件:XX XX XXX ID001.1 XXX999999999 ...

  9. hdu 1874 畅通工程续(模板题 spfa floyd)

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1874 spfa 模板 #include<iostream> #include<stdio ...

  10. poi对wps excel的支持

    今天在使用poi解析xls文件的时候出现了如下异常 Exception in thread"main"java.lang.RuntimeException: Expected an ...