`
田梦桦
  • 浏览: 19064 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js如何阻止冒泡事件

阅读更多

在鼠标点击失去焦点的时候,隐藏DIV的实现如下:

 

$(document).ready(function() {

 

//单击阻止冒泡事件

$("#btnShow").click(function(event){

event.preventDefault();

   event.stopImmediatePropagation();

   $("#hideDIV").show();

});

 

//隐藏DIV阻止冒泡事件

$("#hideDIV").click(function(event){

event.preventDefault();

   event.stopImmediatePropagation();

});

 

});

 

 

//全屏点击事件

$(document).click(function(event){

$("#hideDIV").hide();

});

分享到:
评论

相关推荐

    js阻止冒泡事件

    js阻止冒泡事件的方法有2种。 事件冒泡:当一个元素上的事件被触发时,同样的事件会在那个元素的所有祖先元素中被触发。 这个事件是从原始元素开始一直冒泡到DOM树最上层。 目标元素:任何一个事件的目标元素...

    javascript阻止事件冒泡的一种方法

    `index.html`通常是网页的结构,而`min.js`可能包含了压缩过的JavaScript代码,用于演示阻止事件冒泡的实现。通过查看这两个文件,我们可以更深入地理解阻止事件冒泡的实践应用。 总结一下,阻止事件冒泡是...

    阻止滚动条事件冒泡

    在JavaScript中,我们可以使用`event.stopPropagation()`方法来阻止事件冒泡。当我们在监听的事件处理函数中调用这个方法时,可以确保事件不会继续向上层元素传播。例如,如果我们在一个内部元素上监听`mousewheel`...

    js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件

    在处理事件时,有时我们需要阻止默认行为或者防止事件冒泡,以确保事件按照我们的预期执行。本篇将详细介绍`event.preventDefault()`和`event.stopPropagation()`的用法,并提供示例。 1. **阻止默认事件**: 当一...

    js阻止冒泡

    js阻止冒泡 $(document).click(function(){ $(".scxl").children('ul').hide(); })

    js阻止冒泡及jquery阻止事件冒泡示例介绍.docx

    // 不仅阻止冒泡,也阻止了事件本身 }); }); <div id="ee">aaaaa <a href="baidu.com">baidu.com</a> ``` 在这个例子中,点击按钮时会触发多个事件处理函数,但通过使用`event.stopPropagation();`和`...

    JS阻止冒泡事件以及默认事件发生的简单方法

    如果是在里面,那么呢,有一个onclick事件,也有onclick事件,为了触发的点击事件时,不触发父元素的点击事件,...如果要阻止默认事件的触发,即默认的href事件,那么就需要调用如下函数: 代码如下:function stopD

    JS事件冒泡浏览器兼容

    此外,`event.stopPropagation()`方法可以阻止事件继续向上冒泡,而`event.stopImmediatePropagation()`则不仅可以阻止冒泡,还能阻止同一元素上的其他事件处理函数被执行。 总结一下,JavaScript事件冒泡是浏览器...

    深入分析js的冒泡事件

    在javascript的dom操作做肯定会遇到js的冒泡事件,最常见的是div弹窗事件如图解 当点击灰色部分是弹窗消失,点击黑色部分时没有效果。 通过下面一段代码来分析js的冒泡事件 html代码: 代码如下: <!DOCTYPE ...

    zepto.js中tap事件阻止冒泡的实现方法

    总结来说,zepto.js中虽然tap事件不支持直接阻止冒泡,但是我们可以通过事件委托的方式,在document级别处理tap事件,然后通过判断事件的目标元素来间接实现阻止冒泡的效果。这样做可以在不改变tap事件特性的前提下...

    js阻止冒泡和默认事件(默认行为)详解

    综上所述,JavaScript中的阻止冒泡和阻止默认行为是非常重要的技术点,它们在处理复杂的事件监听和避免不必要的事件触发时发挥着重要的作用。理解并掌握这些技术对于提升前端开发的交互体验与代码质量具有重要意义。

    js阻止冒泡及jquery阻止事件冒泡示例介绍

    js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容。 代码如下: function stopPro(evt){ var e = evt || window.event; //returnValue如果设置了该属性,它的值比事件句柄的返回值...

    JavaScript捕捉事件和阻止冒泡事件实例分析

    本文通过实例分析了如何在JavaScript中捕捉事件以及如何阻止冒泡事件。 事件冒泡是指事件在DOM(文档对象模型)树中从最具体的节点(子节点)向上级节点(父节点)传播的过程。当一个元素发生事件,如点击(onclick...

    Js冒泡事件详解及阻止示例

    对于使用jQuery的情况,可以直接在事件处理函数内调用`event.stopPropagation()`,或者返回`false`以同时阻止冒泡和默认行为。 在实际应用中,事件冒泡可能导致不期望的行为,比如多个事件处理函数被意外触发。因此...

    jQuery中阻止冒泡事件的方法介绍

    ### 一、冒泡事件简介 冒泡事件在用户与网页交互时特别常见。例如,当用户点击一个嵌套在其他元素内的按钮时,该点击事件会首先在按钮上触发,然后依次向上级元素传递。在jQuery中,如果父元素和子元素都绑定了同一...

    JS冒泡事件与事件捕获实例详解

    冒泡事件和事件捕获是JavaScript中处理事件传播的两种主要模型,它们定义了事件在DOM树中传播的顺序。在实际的Web开发中,深入理解这两种模型对于正确处理事件,避免潜在的问题至关重要。 冒泡事件是指当一个事件在...

    在点击div中的p时,如何阻止事件冒泡

    1. `cancelBubble`函数内部首先判断浏览器是否支持`stopPropagation`方法,这是W3C标准中的事件阻止冒泡方法。对于不支持此方法的老版本IE浏览器,它会使用`cancelBubble = true`来达到相同的效果。 2. 在`show(info...

Global site tag (gtag.js) - Google Analytics