javascript - 防止事件冒泡在 jquery 中不起作用

Question

我有这样的 DOM

<div class="modal">
<li>

<div id="block1"></div>
<div id="block2">

<div class="btn-wrap">
<button>cancel</button>
<button>save</button>
</div>

</div>

</li>

我在 li 上附加了一个点击事件，当我点击 block2 的按钮时，该事件发生了。如何防止这种情况发生？

我试过使用 on() 但它不起作用。

$('.btn-wrap').on('click','button:first-child',function(e){
            e.preventDefault();
            alert('test');
        });

Answer 1

你应该使用 stopPropagation防止事件冒泡:

$('.btn-wrap').on('click','button:first-child',function(e){
   e.stopPropagation();
   alert('test');
});