jquery 阻止冒泡事件

什么是冒泡事件？

    子元素被包裹在父元素下，当同时给子元素绑定事件父元素绑定事件时，如果点击子元素，父元素上的事件也会被出发，顺序是子元素→父元素。

为什么要解决冒泡事件？

    当子元素和父元素同时绑定点击事件时，在点击子元素时，不希望父元素的事件也被触发。

如何解决冒泡事件？

  1.event.stopPropagation();

$(function() {
            $(".three").click(function(event) {
                event.stopPropagation();
            });
        });

定义和用法

不再派发事件。

终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后，该节点上处理该事件的处理程序将被调用，事件不再被分派到其他节点。

2.return false;

$(function() {
　　$("#three").click(function(event) {
　　　　return false;
　　});
});
3.event.preventDefault();

$(function() {
    $(".three").click(function(event) {
        　event.preventDefault(); 
    });
});

定义和用法

取消事件的默认动作。该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。例如，如果 type 属性是 "submit"，在事件传播的任意阶段可以调用任意的事件句柄，通过调用该方法，可以阻止提交表单。注意，如果 Event 对象的 cancelable 属性是 fasle，那么就没有默认动作，或者不能阻止默认动作。无论哪种情况，调用该方法都没有作用。

原文地址：https://www.cnblogs.com/shangmao/p/11578577.html