JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别
在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生。
一、event.stopPropagation()
阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时候,如果点击一个连接,这个连接仍然会被打开。
二、event.preventDefault()
阻止默认事件的方法,调用此方法时,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素;
三、return false;
这个方法比较暴力,会同时阻止事件冒泡也会阻止默认事件;写上此代码,连接不会被打开,事件也不会传递到上一层的父元素;可以理解为return
false就等于同时调用了event.stopPropagation()和event.preventDefault()。
JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别的更多相关文章
- JavaScript事件冒泡机制和阻止事件冒泡及默认事件
一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true: FF下:event ...
- vue.js阻止事件冒泡和默认事件
首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...
- vue阻止事件冒泡和默认事件
本文地址:https://www.cnblogs.com/guomin/p/9273862.html 原生js取消事件冒泡 try{ e.stopPropagation();//非IE浏览器 } ca ...
- 原生js中stopPropagation,preventDefault,return false的区别
1.stopPropagation:阻止事件的冒泡,但不阻止事件的默认行为. 最好莫过于用例子说明: <div id='div' onclick='alert("div") ...
- 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return fal的区别
今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...
- js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false
preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...
- js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )
在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...
- js阻止冒泡和默认事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播
-->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...
随机推荐
- BZOJ3262/洛谷P3810 陌上花开 分治 三维偏序 树状数组
原文链接http://www.cnblogs.com/zhouzhendong/p/8672131.html 题目传送门 - BZOJ3262 题目传送门 - 洛谷P3810 题意 有$n$个元素,第 ...
- Vijos1983 NOIP2015Day2T3 运输计划 transport LCA
题目链接Vijos 题目链接UOJ 该博客在博客园的链接 转载一个大佬的题解: 点击这里->大佬题解 下面谈谈我的感悟: 当然写代码也是写的很艰辛: 我力劝C++的同胞们,这题卡常数,Dfs党会 ...
- 做生活的有心人——xxx系统第一阶段总结
2017秋,桃子已经步入大学三年级了,觉得格外幸运 因为现在,有了学习的动力. 如果你和我一样也是在大学中后部分才意识到,自己是个大人了,思维模式开始转变开始融入一些前所未有的认知,觉得自己渺小得如沧 ...
- 错误 在类中找不到main方法请将main方法定义为 public static void main String args否则JavaFX应用程序类必须扩展javafx-ap
最近在使用eclipse编写java程序时遇到这样一个问题: 错误在类中找不到main方法,请将main方法定义为 public static void main(String[] args)否则 J ...
- SpringSecurity整合JWT
一.前言 最近负责支付宝小程序后端项目设计,这里主要分享一下用户会话.接口鉴权的设计.参考过微信小程序后端的设计,会话需要依靠redis.相关的开发人员和我说依靠Redis并不是很靠谱,redis在业 ...
- Java中位运算符的使用
先预知识: 数据在计算机中是以二进制的形式进行存储的,而二进制在内存中是以补码的形式进行存储的.在介绍位运算之前,首先来看一下原码.反码和补码的概念.由于正数的原码.反码和补码的形式都是一样的,所以以 ...
- Err.number错误号和可捕获的 Microsoft access 数据库引擎和 DAO错误说明
错误码 信息2420 数字语法错误2421 日期语法错误2422 字符串语法错误2423 ‘.’.‘!’.或 ‘()’的使用无效2 ...
- vue组件通信那些事儿
一.说说通信 通信,简言之,交流信息.交流结束后,把信息放在哪里,这是一个值得思考的问题.vue中保存状态有2种方式,组件内的data属性和组件外的vuex的state属性. 1.用state的场景 ...
- BZOJ.3631.[JLOI2014]松鼠的新家(树上差分)
题目链接 树剖/差分裸题.. //28260kb 584ms #include <cstdio> #include <cctype> #include <algorith ...
- php error_log() 范例
<?php// 如果无法连接到数据库,发送通知到服务器日志if (!Ora_Logon($username, $password)) { error_log("Oracle da ...