Как изменить свойство 'text-украшение' с помощью jQuery? - PullRequest
Новая
       28

Как изменить свойство 'text-украшение' с помощью jQuery?

5 голосов
/ 23 января 2012

У меня есть таблица со следующей структурой: 

<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" ... /> значение свойства text-художественное оформление, чтобы сделать 'подчеркивание' в следующей строке. 

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

Этот код изменяет все строки.

Заранее спасибо.

1 Ответ

12 голосов
/ 23 января 2012

... для подчеркивания в следующей строке .

(Мой акцент).

Чтобы подчеркнуть его в строке , следующей за , вы хотите перейти к родительской строке флажка, затем к строке его родного элемента, а затем применить 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'
    );
});

Живой пример

...