如何用jQuery改變'text-decoration'屬性？

Question

我有表結構如下：

<table style=" margin-top: 10px; border: 1px wheat solid; width: 100%; font-size: 10px; font-family: Arial , Verdana;text-shadow:0px 1px 0px #000"> 
    <tr class="infoRow" style="background:#666666; "> 
     <td>Element11 </td> 
     <td style="font-size:12px; font-weight:bold; font-family: georgia;">Element12 </td> 
     <td><input type="checkbox" class="check" /></td> 
    </tr> 
    <tr class="infoRow" style="background:#666666; "> 
     <td>Element21 </td> 
     <td style="font-size:12px; font-weight:bold; font-family: georgia;">Element22 </td> 
     <td><input type="checkbox" class="check" /></td> 
    </tr>   
</table> 

我想，檢查<input class="check" ... />屬性文本修飾的值後使「底線」以下行。

$('.check').click(function(){ 
    $('infoRow').css("text-decoration", "underline"); 
}); 

此代碼更改所有行。

在此先感謝。

Answer 1

...在後面的第行'下劃線'。

（我的重點）。

爲了強調它的以下行，你會想上去的複選框的父行，然後被其兄弟行，然後應用css到：

$(this).closest('tr').next('tr').css('text-decoration', 'underline'); 

另外，你可能要測試的複選框是否被選中或取消選中，如：

$('.check').click(function(){ 
    $(this).closest('tr').next('tr').css(
     'text-decoration', 
     this.checked ? 'underline' : 'none' 
    ); 
}); 

Live example