js阻止元素的默认事件与冒泡事件

【js阻止元素的默认事件与冒泡事件】的更多相关文章

js阻止元素的默认事件与冒泡事件

嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,从而带来一定的影响. 1. event.preventDefault(); -- 阻止元素的默认事件.注:a元素的点击跳转的默认事件 , button,radio等表单元素的默认事件 , div 元素没有默认事件例:<a href="http://www.baidu.com" target="_black">百度</a> var samp…

js阻止浏览器的默认行为以及停止事件冒泡（用JQuery实现回车提交，兼容IE、FF浏览器）转

1.阻止浏览器的默认行为 function stopDefault(e) { //如果提供了事件对象,则这是一个非IE浏览器 if(e && e.preventDefault) { //阻止默认浏览器动作(W3C) e.preventDefault(); } else { //IE中阻止函数器默认动作的方式 window.event.returnValue = false; } return false; } 2.停止事件冒泡 function stopBubble(e) { //如果提供…

js 阻止元素发生默认的行为ie兼容

//亲测ie9可以兼容 function Go(event) { var e = event; if (e && e.preventDefault) { e.preventDefault(); } //IE中组织浏览器行为 else { window.event.returnValue = false; } }…

jq中阻止元素的默认行为

event.preventDefault();//阻止元素的默认行为…

js的捕捉事件，冒泡事件

冒泡事件可以查询上个随笔, 捕捉事件正好和冒泡时间正反着所以这代码我把冒泡事件注释, html和css的内容 <style type="text/css"> #box1{width:500px;height:500px;background:#900;} #box2{width:400px;height:400px;background:#090;} #box3{width:300px;height:300px;background:#009;} #box4{width:…

让A超链接无效的办法阻止元素发生默认的行为

$("a").click(function(event){ event.preventDefault(); }); event.preventDefault(); 方法阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交).…

Dom捕捉事件和冒泡事件-原理与demo测试

先参考一下百度百科对冒泡事件流的解释: ----------不喜欢读文字的同学,可以直接看下面demo,传递顺序简单明了! http://baike.baidu.com/link?url=kaeJHTii_1uVgxD_d4LGnqR2mSlNGtEMw8Y9uRZKq_LJjBmmG3lHi9imKniETjpPFPUn4bFCy9dRJ_jfwSzVkK DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有着相当大的影响.这两种事件流分别是捕获和冒泡.和许多Web技…

WPF的路由事件、冒泡事件、隧道事件（预览事件）

本文摘要: 1:什么是路由事件: 2:中断事件路由: 3:自定义路由事件: 4:为什么需要自定义路由事件: 5:什么是冒泡事件和预览事件(隧道事件): 1:什么是路由事件 WPF中的事件为路由事件,所谓路由事件,MSDN定义如下: 功能定义:路由事件是一种可以针对元素树中的多个侦听器(而不是仅针对引发该事件的对象)调用处理程序的事件. 实现定义:路由事件是一个 CLR 事件,可以由 RoutedEvent 类的实例提供支持并由 Windows Presentation Foundation (W…

WPF中的事件及冒泡事件和隧道事件（预览事件）的区别

WPF快速指导10:WPF中的事件及冒泡事件和隧道事件(预览事件)的区别 WPF快速指导10:WPF中的事件及冒泡事件和隧道事件(预览事件)的区别本文摘要: 1:什么是路由事件: 2:中断事件路由: 3:自定义路由事件: 4:为什么需要自定义路由事件: 5:什么是冒泡事件和预览事件(隧道事件): 1:什么是路由事件 WPF中的事件为路由事件,所谓路由事件,MSDN定义如下: 功能定义:路由事件是一种可以针对元素树中的多个侦听器(而不是仅针对引发该事件的对象)调用处理程序的事件. 实现定义:…

WPF中的事件及冒泡事件和隧道事件的区别

WPF中的事件及冒泡事件和隧道事件的区别冒泡事件表示事件从元素树向上到达根元素.这样您就可以在源元素的上方层级对象处理事件.例如,您可向嵌入的 Grid 元素附加一个 Button.Click 处理程序,而不是直接将其附加到按钮本身.气泡事件有指示其操作的名称(例如,MouseDown).隧道事件表示事件从根元素开始向下遍历元素树.这样上游元素就可以在事件到达源元素之前先行截取并进行处理.根据命名惯例,隧道事件带有前缀 Preview(例如 PreviewMouseDown).…

addEventListener 事件监听器冒泡事件）

addEventListener 事件监听器 (冒泡事件) 1.后面绑定的事件照样会执行 2.不会被覆盖 3.调用者是事件源but.addEventListener 4.参数1,事件名(不带on 点击,移开)("click",fn1) 5.参数2执行函数("click",fn1) 6.参数3事件名(捕获或者冒泡) 7.火狐谷歌IE9+ 支持addEventListener ]; //addEventListener 事件监听器 //原事件被执行的时候,后面的事件…

JS 阻止浏览器默认行为和冒泡事件

JS 冒泡事件首先讲解一下js中preventDefault和stopPropagation两个方法的区别: preventDefault方法的起什么作用呢?我们知道比如<a href="http://www.baidu.com">百度</a>,这是html中最基础的东西,起的作用就是点击百度链接到http://www.baidu.com,这是属于<a>标签的默认行为,而preventDefault方法就是可以阻止它的默认行为的发生而发生其他的…

js阻止a标签默认事件的几种方法

方法/步骤疑问打开编辑器,新建html并加入a标签,如图所示,小编想点击a标签时执行pop函数同时禁止a标签的默认的href跳转,该如何阻止呢? 方法一要阻止a标签跳转,可以改变href的值,直接写成“JavaScript:void(0)”即可阻止跳转: 或者将a标签href值写成“JavaScript::”也可以阻止跳转:如图所示方法二可以直接将onclick事件改成return pop():如图,亦可阻止a标签默认浏览器行为: 或者在onclick事件内再加上re…

jq中如何阻止元素的默认行为？

阻止网页元素的默认行为: event.preventDefault(); 或者:return false;…

js阻止表单默认提交、刷新页面

一.阻止刷新页面在表单中的提交按钮<button></button>标签改为<input type="button">或者在<button>中添加属性 type="button" <button type="button" class="update_group"></button> 二.阻止表单的默认提交 1.使用preventDefault() $(…

html,js一个元素做两次不同点击事件

业务需求:一个按钮,第一次点击,修改页面内容,第二次点击,提交修改. 刚开始,我绑定了第一个click事件,用于让右边的内容可编辑.如:$('#id').click(function(){...}); 我在第一个click的执行函数中,我重写一遍click覆盖第一个click事件.如:$('#id').click(function(){$(this).click(function(){...});}); 版权声明:本文为博主原创文章,未经博主允许不得转载.…

js阻止浏览器、元素的默认事件与js阻止事件冒泡、阻止事件流

嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下js阻止默认事件与js阻止事件冒泡示例,大家参考使用吧 1. event.preventDefault(); -- 阻止元素的默认事件.注:a元素的点击跳转的默认事件 , button,radio等表单元素的默认事件 , div 元素没有默认事件例: 复制代码代码如下: <a href="http://www.baidu.com" target="_…

js 停止事件冒泡阻止浏览器的默认行为（阻止超连接 # ）

在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( e && e.stopPropagation )//因此它支持W3C的stopPropagation()方法e.stopPropagation(); else//否则,我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true;return fal…

javascript的阻止默认事件和阻止冒泡事件

这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为在说事件冒泡之前,我们先说说事件对象(Event) Event 在触发DOM上某个事件时,会产生一个事件对象event,这个对象包含着所有事件有关的信息(导致事件的元素.事件的类型.与特定事件相关的信息) 所有浏览器都支持Event对象,但支持方式不同 IE中的事件对象:window.event /* 封装Even…

jquery 阻止冒泡事件和阻止默认事件

jQuery 冒泡和默认事件: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.js"></script>…

探讨Js的事件的冒泡阶段

近来看到了一个新的知识点叫Js的事件冒泡,因此决定自己来研究一番. 大家应该都知道,Js中的事件处理分为三个阶段,1:事件的捕获阶段,2:处于目标阶段,3:事件的冒泡阶段.那么什么是事件的捕获和冒泡呢? 从概念上来说,事件的捕获就是从最外层也就是从html标签开始向内一层层的寻找目标元素,直到捕获到目标为止.而事件的冒泡就是从目标开始,向上一层层的冒泡,直到最上一级为止. 单从概论上来说,可能不是那么的清楚,所以我们直接上代码. <div id="div1"> <di…

js中冒泡事件和捕获事件

js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层捕获事件:捕获事件是从页面的最上层到被绑定元素都会触发. IE只支持事件冒泡,不支持事件捕获冒泡事件和捕获事件的方向是相反的. 形式如下图所示: 一般为浏览器中的元素绑定事件有2种方式: 一.直接在页面元素中进行绑定,此方式采用的是冒泡排序,如: <div id="eventExample&qu…

Js冒泡事件和捕获事件

js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层捕获事件:捕获事件是从页面的最上层到被绑定元素都会触发. IE只支持事件冒泡,不支持事件捕获冒泡事件和捕获事件的方向是相反的. 形式如下图所示: 一般为浏览器中的元素绑定事件有2种方式: 一.直接在页面元素中进行绑定,此方式采用的是冒泡排序,如: <div id="eventExample&qu…

JQuery阻止冒泡事件on绑定中异常情况分析

科普下事件冒泡以及默认行为,以下面例子举列子: 事件冒泡:当点击内部button元素时,会触发自身及外层 a的点击事件,这就是事件冒泡引起的.事件会随着 DOM 的层次结构依次向上传播. 事件冒泡可能会引起意料之外的效果,有时候需要阻止事件的冒泡行为. 默认行为:例子中a的href跳转链接就是所谓的默认行为,或者是表单form的提交. JQuery中阻止冒泡常用到的有以下3个方法: 1:event.stopPropagation(); 只阻止了冒泡事件, 默认行为没有阻止 2:…

第一百七十节，jQuery，事件对象，event 对象，默认行为，冒泡

jQuery,事件对象,event 对象,默认行为,冒泡学习要点: 1.事件对象 2.冒泡和默认行为 JavaScript 在事件处理函数中默认传递了 event 对象,也就是事件对象.但由于浏览器的兼容性,开发者总是会做兼容方面的处理.jQuery 在封装的时候,解决了这些问题,并且还创建了一些非常好用的属性和方法. 一．事件对象事件对象就是 event 对象,通过处理函数默认传递接受.之前处理函数的 e 就是 event 事件对象,event 对象有很多可用的属性和方法,我们在 Ja…

javascript冒泡事件详解

冒泡事件: 定义:当多个Dom元素互相嵌套的时候,一个元素触发了某个事件(例如Click事件),那么嵌套此事件的所有元素都会被触发一次Click事件,注意:只会触发他的直系亲属元素,而与其自己,父级,爷级等等同级的亲戚集是不会触发的捕获事件: *定义:** 同冒泡事件含义相似,只是将冒泡事件的触发顺序倒过来即可 DOM事件流元素的触发流程分为三个阶段捕获阶段:先从祖先级一直找到触发的源元素(所有元素都触发了相同事件) 目标阶段:找到原元素,然后触发源元素的事件冒泡阶段:然后重新流回祖先元…

javascript中的事件冒泡、事件捕获和事件执行顺序

谈起JavaScript的事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有着相当大的影响.这两种事件流分别是捕获和冒泡.和许多Web技术一样,在它们成为标准之前,Netscape和微软各自不同地实现了它们.Netscape选择实现了捕获事件流,微软则实现了冒泡事件流.幸运的是,W3C决定组合使用这两种方法,并且大多数新浏览器都遵循这两种事件流方式. 1事件传播--冒泡与捕…

关于DOM2级事件的事件捕获和事件冒泡

DOM2级事件中addEventListener的执行机制,多个addEventListener同时添加时的执行先后规律: W3C的DOM事件触发分为三个阶段:①.事件捕获阶段,即由最顶层元素(一般是从window元素开始,有的浏览器是从document开始,至于其中的差别我稍后会更新)开始,逐次进入dom内部,最后到达目标元素,依次执行绑定在其上的事件②.处于目标阶段,检测机制到达目标元素,按事件注册顺序执行绑定在目标元素上的事件.③.事件冒泡阶段,从目标元素出发,向外层元素冒泡,最后到达顶层…

Javascript事件模型(一)：DOM0事件和DOM2事件

javascript事件模型,本文主要有以下内容: DOM0事件模型 DOM2事件模型一.DOM0事件模型早期的事件模型称为DOM0级别. DOM0的事件具有极好的跨浏览器优势, 会以最快的速度绑定, 如果你通过DOM2绑定要等到JS运行, DOM0不用, 因为DOM0是写在元素上面; 直接在dom对象上注册事件名称,就是DOM0写法,比如: document.getElementById("test").onclick = function(e){}; 另外一种写法是: doc…

DOM事件： DOM事件级别、DOM事件流、DOM事件模型、DOM事件捕获过程、自定义事件

前端面试中只要问到事件,就肯定会有DOM事件:如果回答出来了,就会一直向下延申,其实这些东西都很简单,但我第一次被问到的时候,也是懵的: DOM事件级别: DOM0 element.onclick = function() { } DOM1 一般只有设计规范,没有设计跟事件相关的东西:所以直接跳过 DOM2 element.addEventListener(‘click’, function() { }, false) DOM3 element.addEventLIstener(‘keyup’,…