js事件防止冒泡】的更多相关文章

js事件: javascript使我们能够有能力创建动态页面,事件就是可以被js侦测到的行为,网页中每个元素都可以产生某些触发js函数的事件. 例如我们可以在用户点击某个按钮时产生一个click事件来触发某个函数. 事件冒泡: 就是事件从目标开始,网上冒泡直到页面的最上一级标签,也就是当一个元素被触发,同样的事件也会在该元素的所有祖先元素中从内向外一次触发. 解决冒泡事件: 事件名.stopPropagation()或者直接return false. 在IE中,window.e.cancelBu…
$("body").on("click", "#id", function (ev) { ev = ev || event;要写的逻辑代码 ev.stopPropagation();//这个方法可以阻止事件的冒泡 });…
原文连接:http://www.cnblogs.com/jams742003/archive/2009/08/29/1556187.html 1. 事件目标 如今.事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,可是没有被全部浏览器实现 . jQuery对这个事件对象进行了必要的扩展,从而在不论什么浏览器中都能够使用这个属性.通过.target,能够确定DOM中首先接收到事件的元素(即实际被单击的元素). 并…
参考 https://www.cnblogs.com/zhuzhenwei918/p/6139880.html event.stopPropagation();…
什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶层,即document对象(有些浏览器是window).   附一张图: 如何来阻止Js事件冒泡? <!DOCTYPE html> <html> <head&g…
近来看到了一个新的知识点叫Js的事件冒泡,因此决定自己来研究一番. 大家应该都知道,Js中的事件处理分为三个阶段,1:事件的捕获阶段,2:处于目标阶段,3:事件的冒泡阶段.那么什么是事件的捕获和冒泡呢? 从概念上来说,事件的捕获就是从最外层也就是从html标签开始向内一层层的寻找目标元素,直到捕获到目标为止.而事件的冒泡就是从目标开始,向上一层层的冒泡,直到最上一级为止. 单从概论上来说,可能不是那么的清楚,所以我们直接上代码. <div id="div1"> <di…
什么是事件起泡:一个事件不能凭空产生,这就是事件的发生等等,接下来为大家介绍下jquery阻止事件起泡以及关于js事件起泡的验证,感兴趣的朋友可以参考下哈       (1)什么是事件起泡 首先你要明白一点,当一个事件发生的时候,该事件总是有一个事件源,即引发这个事件的对象,一个事件不能凭空产生,这就是事件的发生. 当事件发生后,这个事件就要开始传播.为什么要传播呢?因为事件源本身并没有处理事件的能力.例如我们点击一个按钮时,就会产生一个click事件,但这个按钮本身不能处理这个事件(废话),事…
JavaSciprt事件中有两个很重要的特性:事件冒泡以及目标元素. 事件冒泡: 当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这 一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层. 目标元素: 任何一个事件的目标元素都是最开始的那个元素,在我们的这个例子中也就是按钮,并且它在我们的元素对象中以属性的形 式出现.使用事件代理的话我们可以把事件处理器添加到一个元素上,等待一个事件从它的子级元素里冒泡上来,并且可以很方…
js 事件监听  冒泡事件   的取消 [自己写框架时,才有可能用到] <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/…
冒泡事件可以查询上个随笔, 捕捉事件正好和冒泡时间正反着 所以这代码我把冒泡事件注释, 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:…