與onclick切換複選框切換雙切換（如何阻止內部切換）

Question

我有一個<li>內的複選框作爲菜單的一部分。包裝物品有一個點擊處理器，用於切換複選框（與整個菜單的感覺一致）。問題是如果用戶直接點擊複選框，它將執行其默認切換，然後外部處理程序也切換它。我怎樣才能防止這個雙切換？

<li onclick='/*toggle checkbox*/'><input type='checkbox'/>...</li> 

我試過disabled但改變渲染，這是我不想要的。

我使用jQuery的情況下，有一個功能有幫助。

Answer 1

可以使用.stopPropagation()功能，以防止傳播了DOM樹點擊jQuery的方法。

Here's an example

$(document).ready(function() { 
    $("input[type=checkbox]").click(function (evt) { 
     evt.stopPropagation(); 
     $("#thetext").html("checbox clicked"); 
    }); 

    $("li").click(function() { 
     $("#thetext").html("li clicked"); 
    }); 
}); 

HTML

<ul> 
    <li> 
     <input type='checkbox' /> 
    </li> 
</ul> 
<div id="thetext">hm</div> 

Answer 2

下面是該http://api.jquery.com/event.stopPropagation/