jquery - JQuery点击里面的div

Question

我正在尝试在已经有点击事件的 li 内的 div 上添加点击事件。我不希望在触发 div click 事件时触发 li click 事件。

这是我想要做的事情的jsfiddle。 http://jsfiddle.net/2srUd/5/

当我点击 .inside 时，我不希望 #outside 点击触发。我假设我需要在选择器 $(".inside") 中添加一个 not

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

        $("#outside").click(function() {
            alert("outside click");
        });

        $(".inside").click(function() {
            alert("inside click");
        });

    });
</script>
<ul>
    <li id="outside" style="border:2px solid red; padding:20px;">
        <div class="inside" style="border:2px solid blue; ">Click This Div. I want to accept the inside click but not the outside click.</div>
    </li>
</ul>

Answer 1

简单修复：

    $(".inside").click(function(e) {
        e.stopPropagation();
        alert("inside click");
    });

http://api.jquery.com/event.stopPropagation/

防止事件在 DOM 树中冒泡，防止任何父处理程序收到事件通知。

基本上你不希望它触发父事件处理程序，所以你停止传播。

Answer 2

就这样做：http: //jsfiddle.net/2srUd/24/

$(document).ready(function() {
        $("#outside").click(function() {
            alert("outside click");
        });

        $(".inside").click(function() {  
            alert("inside click");
            return false;
        });

    });