阻止冒泡事件
**方式一:event.stopPropagation();

    $("#div1").mousedown(function(event){
        event.stopPropagation();
    });

方式二:return false;

    $("#div1").mousedown(function(event){
        return false;
    });

但是这两种方式是有区别的。return false 不仅阻止了事件往上冒泡,而且阻止了事件本身。event.stopPropagation() 则只阻止事件往上冒泡,不阻止事件本身。**

**这是方法一只有孩子的事件,阻止了父亲的事件**
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        ul li{
            list-style: none;
            float: left;
            width: 200px;
            font-size: 20px;
        }
    </style>
</head>
<body>
    <ul>
        <Li>孩子1</Li>
        <Li>孩子2</Li>
        <Li>孩子3</Li>
        <Li>孩子4</Li>
    </ul>

</body>
<script type="text/javascript" src="jquery-1.12.3.js"></script>
<script type="text/javascript">
    $('ul').on('click',function(){
        alert('我是父親')
    })
    $('ul li').on('click',function(event){
        alert('我是孩子')
        event.stopPropagation();
    })
</script>
</html>

本文转载:CSDN博客