發現點擊來選擇一個表

Question

喜
我的表看起來像這樣

<table> 
<tbody> 
    <tr> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='action'><a href="www.yahoo.com">go to some other url</a></td> 
    </tr> 
</tbody> 
<tbody style='display:none'> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
</tbody> 
<tbody> 
    <tr> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='center'>some text</td> 
    <td class='action'><a href="www.yahoo.com">go to some other url</a></td> 
    </tr> 
</tbody> 
<tbody style='display:none'> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
</tbody> 

在第一視圖中僅示出第一行TBODY

和第二TBODY行是隱藏的內TD。
我需要當用戶點擊第一個表格行時，第二個表格行將被顯示/隱藏。
我設法用下面的代碼

$('tbody').toggle(function(){ 
$(this).next('tbody:first').show(); //display the first next tbody   
} 
,function(){ 
$(this).next('tbody:first').hide();//hide the next tbody 
} 
); 

現在我還需要做到這一點，當用戶點擊這個顯示/隱藏功能將不會發生的「.action」類和表的表單元格單元格鏈接將預製

我試過很多選擇，但什麼也沒有工作， 我將不勝感激，如果有人能夠給我一些解決這個問題
THANKS

Answer 1

一種方法是在事件處理程序產生事件的檢查：

$('tbody').click(function(event){ 
    if(!$(event.target).is('td.action a')) { 
     var $next = $(this).next('tbody'); // no need for :first 
     $next.toggle(!$next.is(':visible')); 
    } 
} 

參考：toggle，is，:visible

Answer 2

您可以HANDL E中的click事件這些細胞，並呼籲e.stopPropagation防止事件冒泡到<tbody>：

$('.action').click(function(e) { e.stopPropagation(); });