在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生。
  一、event.stopPropagation()
  阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时候,如果点击一个连接,这个连接仍然会被打开。
  二、event.preventDefault()
  阻止默认事件的方法,调用此方法时,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素;
  三、return false;
  这个方法比较暴力,会同时阻止事件冒泡也会阻止默认事件;写上此代码,连接不会被打开,事件也不会传递到上一层的父元素;可以理解为return
 false就等于同时调用了event.stopPropagation()和event.preventDefault()。

JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别的更多相关文章

  1. JavaScript事件冒泡机制和阻止事件冒泡及默认事件

    一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true:  FF下:event ...

  2. vue.js阻止事件冒泡和默认事件

    首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...

  3. vue阻止事件冒泡和默认事件

    本文地址:https://www.cnblogs.com/guomin/p/9273862.html 原生js取消事件冒泡 try{ e.stopPropagation();//非IE浏览器 } ca ...

  4. 原生js中stopPropagation,preventDefault,return false的区别

    1.stopPropagation:阻止事件的冒泡,但不阻止事件的默认行为. 最好莫过于用例子说明: <div id='div'  onclick='alert("div") ...

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

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

  6. js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false

    preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...

  7. js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )

    在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...

  8. js阻止冒泡和默认事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播

    -->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...

随机推荐

  1. HDU2853 Assignment KM

    原文链接http://www.cnblogs.com/zhouzhendong/p/8284105.html 题目传送门 - HDU2853 题意概括 (来自谷歌翻译) 题解 这是一道好题. 我们首先 ...

  2. P1012 拼数 字符串

    题目描述 设有nn个正整数(n≤20)(n≤20),将它们联接成一排,组成一个最大的多位整数. 例如:n=3n=3时,33个整数1313,312312,343343联接成的最大整数为:34331213 ...

  3. 初识(试)LoadRunner

    一.安装和破解 1.傻瓜式安装.[注意:最好不要默认路径安装,因为64位的win7系统安装LR11时,会默认安装到“Program files (x86)”的目录中,该目录名称有空格,会导致录制“We ...

  4. Working out(DP)

    题目描述: 题意: 有n*m个格子, 走过一个格子可以得到相应的分数. A 从(1,1)沿 下 或 右 走到(n,m) B 从(n,1)沿 上 或 右 走到(1,m) 两人路径有且只能有一个格子重合( ...

  5. Codeforces 854C Planning 【贪心】

    <题目链接> 题目大意: 表示有n架飞机本需要在[1,n]时间内起飞,一分钟只能飞一架.但是现在[1,k]时间内并不能起飞,只能在[k+1,k+n]内起飞.ci序号为i的飞机起飞延误一分钟 ...

  6. HDU 2426 Interesting Housing Problem (最大权完美匹配)【KM】

    <题目链接> 题目大意: 学校里有n个学生和m个公寓房间,每个学生对一些房间有一些打分,如果分数为正,说明学生喜欢这个房间,若为0,对这个房间保持中立,若为负,则不喜欢这个房间.学生不会住 ...

  7. HDU 2289 Cup【二分】

    <题目链接> 题目大意: 一个圆台型的杯子,它的上底半径和下底半径已经给出,并且给出它的高度,问你,体积为V的水倒入这个杯子中,高度为多少. 解题分析: 就是简单的二分答案,二分枚举杯中水 ...

  8. Django之ORM操作总结

    Django之ORM总结 表结构 from django.db import models # 一对多:班级与学生 # 多对多:班级与老师 # Create your models here. #创建 ...

  9. Django 学习第十二天——Auth 系统

    一.Auth系统中的表: 从表的名称我们就能看出, auth_user,auth_group,auth_permission分别 存放了用户,用户组,权限的信息表. 另外三张表就是多对多的关系表 Us ...

  10. linux 学习笔记 groupadd创建组

    1> groupadd -g test2 2>usermod -d /home/test -G test2 test 3>su user 4>groups 注意:root用户才 ...