`

jQuery 阻止事件冒泡

 
阅读更多
http://www.cnblogs.com/jiqing9006/archive/2012/09/11/2679831.html 

function playVideo(channel){
	if(channel == undefined || channel == ""){
		return;
	}
	DPSDK.play(channel);
	window.event.stopPropagation && window.event.stopPropagation();
    window.event.cancelBubble && (window.event.cancelBubble = true);
}



<body>
<div id="content">
    外层div元素
    <span>内层span元素</span>
    外层div元素
</div>

<div id="msg"></div>
</body>


<script type="text/javascript">
$(function(){
       // 为span元素绑定click事件
    $('span').bind("click",function(event){
        var txt = $('#msg').html() + "<p>内层span元素被点击.<p/>";
        $('#msg').html(txt);
        event.stopPropagation();    //  阻止事件冒泡
    });
    // 为div元素绑定click事件
    $('#content').bind("click",function(event){
        var txt = $('#msg').html() + "<p>外层div元素被点击.<p/>";
        $('#msg').html(txt);
        event.stopPropagation();    //  阻止事件冒泡
    });
    // 为body元素绑定click事件
    $("body").bind("click",function(){
        var txt = $('#msg').html() + "<p>body元素被点击.<p/>";
        $('#msg').html(txt);
    });
})
</script>
分享到：
| ServletContext
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jquery阻止事件冒泡

    jQuery库提供了方便的方式来处理DOM事件，包括阻止事件冒泡的功能。这个功能在构建交互式网页时非常有用，可以避免不必要的事件处理或者防止多次执行相同的操作。 jQuery中的`event.stopPropagation()`方法是阻止...

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

    ### JS与jQuery阻止事件冒泡详解 #### 一、引言 在Web开发中，事件处理是不可或缺的一部分，其中事件冒泡机制尤为重要。事件冒泡是指事件从最深层的节点开始，逐级向上传播至最顶层的节点。在某些情况下，我们希望...

    事件冒泡是什么如何用jquery阻止事件冒泡

    在jQuery中，可以通过几种方式来阻止事件冒泡。 - 使用返回false的方式：在事件处理函数中直接返回false，这将同时阻止事件冒泡和事件的默认行为。例如：`$(selector).click(function() { return false; });` - ...

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

    标题中提到的“js阻止冒泡及jquery阻止事件冒泡示例介绍”涉及JavaScript和JQuery两种技术在事件处理中阻止事件冒泡的概念。冒泡是指当一个元素上触发了某个事件（如点击），这个事件不仅会在该元素上进行处理，还会...

    利用JQuery阻止事件冒泡

    除了使用event对象的方法外，JQuery的事件处理函数还提供了一个简写形式来阻止冒泡，即直接在事件处理函数的末尾返回false。这等同于调用了event.stopPropagation()和event.preventDefault()。例如： ```javascript...

    JQuery 提供了两种方式来阻止事件冒泡.rar

    本资料主要探讨了JQuery阻止事件冒泡的两种方法。 首先，我们来看第一种方法——`event.stopPropagation()`。这个方法是jQuery中的一个事件处理函数，当在事件处理程序中调用它时，可以阻止事件继续在其DOM层次结构...

    Jquery阻止事件冒泡 event.stopPropagation

    标题中的"Jquery阻止事件冒泡 event.stopPropagation"就涉及到如何在jQuery中避免事件冒泡到DOM树的上级元素。`event.stopPropagation()`是jQuery提供的一个方法，用于阻止事件继续在DOM树中向上冒泡。当你调用这个...

    jQuery阻止事件冒泡实例分析

    jQuery是JavaScript库的一种，由John Resig在2006年发布，它通过...以上内容阐述了jQuery中阻止事件冒泡的原理和方法。通过阅读这些知识点，Web开发人员可以更有效地控制事件的执行流程，提高应用的性能和用户体验。

    jquery阻止冒泡实例

    jquery阻止冒泡的所有方法，适合初学jquery者，是一篇很好的学习文稿

    jQuery阻止事件冒泡具体实现

    在给定的示例中，`jQuery` 提供了 `event.stopPropagation()` 方法来阻止事件冒泡。在修改后的代码中，当用户点击`span`元素时，通过调用 `event.stopPropagation()`，可以确保点击事件不会继续传播到`div`和`body`...

    JQuery中阻止事件冒泡几种方式及其区别介绍

    JQuery 提供了两种方式来阻止事件冒泡。 方式一：event.stopPropagation(); 代码如下: $(“#div1”).mousedown(function(event){ event.stopPropagation(); }); 方式二：return false; 代码如下: $(“#div1”)....

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

    一、冒泡事件简介 当我们点击一个控件的时候，如果包括这个控件的父控件也有click事件，则会继续执行。比如：div下的a都有click事件，点击a的时候，会alert出现2次。这个现象叫做冒泡事件。 这个事件从原始元素开始...

    jQuery事件绑定和解绑、事件冒泡与阻止事件冒泡及弹出应用示例

    综上所述，jQuery事件处理机制中的绑定和解绑、事件冒泡与阻止事件冒泡是前端开发中非常重要的知识点。在实际开发过程中，灵活运用这些技术可以实现更加丰富的交互效果，并提升用户体验。通过上述实例的介绍和分析，...

    jquery关于事件冒泡和事件委托的技巧及阻止与允许事件冒泡的三种实现方法

    // 只阻止默认行为，不阻止冒泡 e.preventDefault(); }); ``` 3. 使用`event.stopPropagation()`：此方法用于阻止事件向上冒泡到父元素，但不会影响默认行为。例如： ```javascript $('#btn').click(function...

Magicbox
Global site tag (gtag.js) - Google Analytics