使用JQuery，我該如何停止傳播DOM的點擊事件？

Question

考慮下面的HTML片段：

<li class="list"> 
    <img src="/assets/img/site/arrow_black.png"/>My List Element<span class="star"></span> 
</li> 

當我點擊事件綁定到li元素，並綁定一個click事件到.star類，我的問題是：

我如何當我點擊明星時，停止點擊事件li發射？

我的jQuery代碼看起來沿着線的東西：

$(".list").click(function() { 
//do something 
} 

$(".star").click(function() { 
//do something 
} 

Answer 1

見jQuery.stopPropagation()

$(".star").click(function(e) { 
    e.stopPropagation(); 
    // do work 
} 

Answer 2

嘗試event.stopPropagation();

$(".star").click(function(event) { 
    event.stopPropagation(); 
    // Do something 
} 

Answer 3

你需要停下來.star偶數propgagation 。

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

$(".star").click(function(ev) { 
    ev.stopPropagation(); 
}); 

Answer 4

您可以使用事件代表團..

應用事件偵聽器UL

document.getElementById("parent-list").addEventListener("click",function(e) { 

if(e.target && e.target.nodeName == "LI") { 
    var classes = e.target.className.split(" "); 

    if(classes) { 

     for(var x = 0; x < classes.length; x++) { 

     if(classes[x] == "star") { // do your thing 
            } 
        } 
      } 
    } 
}); 

}); 

或者只是使用了preventDefault明星類