【问题标题】:jQuery Prevent div's click behavior when inline href is clicked点击内联href时jQuery防止div的点击行为
【发布时间】:2011-11-14 14:22:42
【问题描述】:

我有一个包含 href 的 div。 div 有一个 jQuery 实时点击事件:

$(".item").live("click", function() { 
    window.location = this.id;  
});

在 div 中我有一个 href:

<div class="item" id="/test.html">
    <a href="javascript:void(0);" class="test" id="123">link</a>
</div>

还有一个实时点击事件:

$(".test").live("click", function() { 
    $(".item").unbind('click');
    alert(this.id);
});

我尝试实现的是单击 div 将 div id 作为位置加载,同时单击 div 内的链接做它自己的事情,同时防止 div 点击行为。

我知道我可以将 href 从 div 中取出,但我不希望这样做 ;-)

【问题讨论】:

    标签: javascript jquery click live preventdefault


    【解决方案1】:

    更新

    如果可以,请使用 jQuery 1.7 使用 .on 进行事件委托,并阻止锚点点击传播:

    $(document).on("click","a.test", function(e) { 
        e.stopImmediatePropagation();
    });
    
    $(document).on("click","div.item", function(e) { 
        // whatever
    });
    

    http://jsfiddle.net/AuHjA/3/

    否则使用.delegate 而不是.live

    $(document).delegate("a.test", "click", function(e) { 
        e.stopPropagation();
    });
    
    $(document).delegate("div.item", "click", function(e) { 
        //whatever
    });
    

    http://jsfiddle.net/mblase75/AuHjA/4/

    【讨论】:

    • 马特那是因为你有它倒退,你需要停止链接中的传播,而不是 div jsfiddle.net/azizpunjani/AuHjA/5。它在这种情况下工作的原因是因为父 div 和子元素都已与 .live 绑定,因此 e.stopPropagation() 确实有效。
    猜你喜欢
    • 1970-01-01
    • 2012-01-17
    • 1970-01-01
    • 1970-01-01
    • 2013-07-28
    • 1970-01-01
    • 2014-03-06
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多