如何將兩個單獨的onClick事件與一個元素放入另一個元素中？

Question

我有一個<div>元素在另一個<div>。我在包含div上有一個onClick事件，但我想讓內部div忽略那個onClick事件，因爲我有一個單獨的onClick事件正在進行。下面是一些示例代碼：

<div id='container' onClick='javascript:function1();'> 
    outside of the inside div 
    <div id='inside' onClick='javascript:function2();'> 
    inside the inside div 
    </div> 
</div> 

想象一下容器是一個大盒子，裏面的div是一個小盒子。基本上現在代碼的工作方式是，每當我點擊「內部」時，即使對於「容器」和「內部」，它也會觸發onClick。我不想那樣;我希望每個人都有自己的onClick事件。這可能嗎？

Answer 1

Inside function2() put return false這將防止事件冒泡。

既然你已經在你的代碼中提到的jQuery你可以刪除HTML標記的事件處理程序，並把它裏面的document.ready

HTML

<div id='container'> 
    outside of the inside div 
    <div id='inside'> 
    inside the inside div 
    </div> 
</div> 

jQuery的

$(function(){ 
    $("#container").click(function(){ 
     function1(); 
    }); 

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

你也可以使用event.stopPropagation()而不是返回false。