點擊觸發事件除了複選框+標籤

Question

我有一個表格行，點擊時會觸發一個事件。在行內有（未顯示）複選框+其樣式化標籤。

我想要的是防止（我猜用：不是或.not（），但不能弄清楚）執行如果複選框/標籤被點擊。

HTML：

CSS：

center { 
margin-top:20px; 
} 

input[type=checkbox] + label { 
    width:10px; 
    height:10px; 
    background-color:red; 
} 

input[type=checkbox] { 
    display:none; 
} 

table tr { 
height:40px; 
    background-color:gray; 
} 

table td { 
padding:5px; 
} 

JS：

$('.pend').on('click',function(){ 
    $(this).append('text'); 
    return false; 
}) 

的jsfiddle：http://jsfiddle.net/ySuGB/2/

Answer 1

您需要防止事件冒泡點擊複選框/標籤。

見下文，

//      V-- Is the TD containing the checkbox and the label. 
$('.pend :checkbox').parent().on('click', function(event) { 
    event.stopPropagation() 
}); 

DEMO：http://jsfiddle.net/ySuGB/12/

Answer 2

可以檢查事件的目標是標籤（ETC）：

$('.pend').on('click',function(e){ 
    if(e.target.tagName=='LABEL') 
    return false; 
    $(this).append('text'); 
    return false; 
})​ 

http://jsfiddle.net/ySuGB/9/

Answer 3

e.stopPropagation （）就是你需要。

http://jsfiddle.net/jNDYJ/

$('.pend input:checkbox').add('.pend label[for=bb]').click(function(e){ 
    e.stopPropagation(); 
}); 

Answer 4

$('.pend').on('click',function(){ 
    var $this = $(this); 
    $this.off('click'); 
    $this.find('td:eq(2)').append('text'); 
})​