。。这是Jquery 的一个bug 吗?

gclove
  • 1.4k
<!--这是主要代码-->
<a class="my-item">
    <span> Click me A </span>

    <button type="button" class="btn-delete"> Delete !!
    </button>
</a>


<script>
    $(document).ready(function () {

        $(document).on('click', ".my-item", function () {
            alert("Hello A! ");
        });

        $(document).on('click', ".btn-delete", function () {
            alert("^~^ You have click Delete! ");
        });

    });
</script>

<!-- End 主要代码-->

点击 删除的 时候 , 还会触发另一个 a 的 click 事件 - -

回复
阅读 2.6k
3 个回答
$(document).on('click', ".btn-delete", function (event) {
            alert("^~^ You have click Delete! ");
            event.stopPropagation();
        });

典型的冒泡

冰星寒水
  • 1.4k

这是事件冒泡啊,
你的二个事件没有阻止冒泡,所以触发了第一个事件

 $(document).on('click', ".btn-delete", function (e) {
            alert("^~^ You have click Delete! ");
            e.stopPropagation();
        });

这是事件冒泡,父级如果和子级绑有相同事件(如题主的click事件),则在触发子集事件的时候同时会触发父级相同事件,所以要阻止冒泡e.stopPropagation();

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏