当使用直接事件侦听器删除项时，事件停止冒泡到委派的事件

Question

使用jquery事件进行实验。

看起来，如果我在它自己的事件处理程序中删除一个项，它会阻止事件冒泡为委托事件，但直接绑定的事件仍然会触发。

但是，如果我在委派的事件中删除它，事件就会像我预期的那样传播。

由于我没有返回false或使用stopPropagation（），我本以为其他事件仍然会触发，无论它们是直接绑定还是委派的。

这有道理吗？这是jQuery的错误吗？想知道它为什么会这样。

小提琴在这儿：http://jsfiddle.net/ahhgu1bb/

当您单击蓝色点时，"A UP…"从未出现在控制台中。

当您单击绿色点时，它确实会。

代码：

html:

<div class="main-background">
    <div class="inner-area">
        <div class="blue-point"></div>
        <div class="green-point"></div>
    </div>
</div>

javascript/jquery：

$('.main-background').on('mousedown', '.inner-area', function(e) {
   console.log('A DOWN - deletegated inner-area mouse down'); 
});
$('.main-background').on('mouseup', '.inner-area', function(e) {
   console.log('A UP - deletegated inner-area mouse up'); 
});
$('.main-background').on('mouseup', function(e) {
   console.log('B UP - direct inner-area mouse up'); 
});
$('.blue-point').on('mouseup', function(e) {
   console.log('C UP - direct point mouse up');
   $(this).remove();
});
$('.main-background').on('mouseup', '.green-point', function(e) {
   console.log('D UP - delegated point mouse up');
   $(this).remove();
});

Answer 1

从jQuery文档：http://api.jquery.com/on/

对于委托事件：

当事件直接发生在绑定元素上时，不调用处理程序，而仅针对与选择器匹配的子体（内部元素）调用处理程序。jQuery将事件从事件目标标记到附加处理程序的元素（即从最里面到最外面的元素），并为与选择器匹配的路径上的任何元素运行处理程序。

因此，如果我使用事件委派，那么事件实际上并没有直接绑定到附加的元素，只是从目标元素冒泡触发的。

因此，在我的案例中，由于在冒泡开始之前删除了目标元素，所以冒泡不会发生（向Amin Jafari致敬！），因此委派的事件永远不会触发。但任何直接绑定的事件处理程序都会被触发。