2

注意***：必须在平板电脑上测试，我只在Ipad上测试过

1 次触摸将在同一项运动中触发不同对象的不同事件

http://jsfiddle.net/wR6dK/1/

HTML：

<div id="box1"></div>
<div id="box2"></div>

JS：

$("#box1").on('tap',function(){
    $("#log").append('box1 clicked <br>');
    $(this).fadeOut(0);
});

$("#box2").on('tap',function(){
    $("#log").append('box2 clicked <br>');
    $(this).fadeOut(0);
});

这种情况下绿框是隐藏的……它可以移开或重新排列z-index，都将触发红框的事件

它是如何工作的？它是否也发生在“vclick”和其他事件中？

它是一个错误吗？

4

1 回答 1

2

这是最古老的 javascript 错误之一，由于很长一段时间都不知道，因此从未修复过。简而言之，javascript 从来就不是这样使用的，而是给人类一个工具，他会根据需要改变它，因此我们有像 jQuery 和 jQuery Mobile 这样的框架。

这也称为跌倒事件。可以通过以下功能防止它：

并返回假。

这是您修改为使用此解决方案的示例：http: //jsfiddle.net/Gajotres/wR6dK/5/

$("#box1").on('tap',function(e){
    $("#log").append('box1 clicked <br>');
    $(this).fadeOut(0);
    e.stopPropagation();   
    return false;    
});

$("#box2").on('tap',function(e){
    $("#log").append('box2 clicked <br>');
    $(this).fadeOut(0);
    e.stopPropagation();   
    return false;    
});

让我给你看另一个例子，这样你就可以在 jQuery Mobile 的情况下理解这个问题：http: //jsfiddle.net/Gajotres/Xz2np/

$('#page1').live('pagebeforeshow',function(e,data){
    $('.someDiv').live('click', function (e) {   
        alert('Event is not going to propagate to content div, thus not hiding a header');             
        event.stopPropagation();   
        event.stopImmediatePropagation();
    });
});

要理解这个问题，只需单击一个 DIV 示例然后注释这 2 行，再次运行一个示例并再次单击一个 DIV。并且请我知道在 jQuery 1.9 中不推荐使用 live 但这是我的旧示例。

于 2013-04-17T22:31:07.807 回答