Question

因此，有很多问题要求如何防止儿童事件触发父母事件，但我似乎无法找到相反的事件。

我像这样打开或关闭父事件：

var body_event = function(e){
    console.log('test');
};

$('#btn').toggle(
    function(e){
        $('body').bind('click', body_event);
    }, 
    function(){
        $('body').unbind('click', body_event);
    }
);

目前，如果我在这样的页面上运行它：

<body>
    <div id="btn">click to activate</div>
    <div id="example" onclick="alert('do not show this when event is bound')">
        try the body event by clicking here
    </div>
</body>

切换效果很好，但当我点击“点击此处尝试身体事件”时，警报仍会显示。我希望能够在绑定body事件时忽略所有子事件，而无需单独引用子事件。

换句话说，我正在寻找一个更好的解决方案，而不是在切换上做这样的事情：

$('#example").attr('onclick', '');

Answer 1

这很接近，但并不完全存在。它不检查特定函数是否绑定，只检查是否有绑定到jQuery对象的任何事件。

必须有一种方法可以查询事件以查找是否绑定了一个，然后是它指向的功能。希望这会让你开始。

http://jsfiddle.net/PhjB8/

var body_event = function(e) {
    alert('test');
};

$('#btn').toggle(

function(e) {
    $('body').addClass('active').bind('click', body_event);
}, function() {
    $('body').removeClass('active').unbind('click', body_event);
});

$('#example').click(function() {
    //debugger;
    if ($('body').data('events') == undefined) {
        alert('do not show this when event is bound');
    }
});

Answer 2

event.stopPropagation（）可以在body_event？

中解决这个问题

防止父事件触发子事件

2 个答案: