2010-05-22 4 views
1

У меня есть следующий HTML код. Я пытаюсь сделать так, чтобы div с именем javaRatingDiv отображался после проверки флажка с именем java.jquery access sibling TD в таблице

Я не могу понять, как перейти к следующему TD в таблице через jquery.

<div id="languages"> 
    <table style="width:inherit"> 
    <tr style="height:50px; vertical-align:top"> 
    <td>Select the languages that you are familiar with and rate your knowledge:</td> 
    </tr> 
    <tr> 
    <table style="width:75%;" align="center"> 
    <tr id="tableRow"> 
     <td id="firstTD"><input type="checkbox" name="java" value="java" />&nbsp;Java</td> 
     <td id="secondTD" style="width:200px;"> 
     <div id="javaRatingDiv" style="display:none"> 
      <input name="javaRating" type="radio" value="1" class="star"/> 
      <input name="javaRating" type="radio" value="2" class="star"/> 
     </div> 
     </td> 
    </tr> 
    </table> 
    </tr> 
    </table> 
</div> 

ответ

2

Ради вопроса и случае нескольких «javaRatingDivs» это будет работать внутри функции флажок, нажмите:

$(this).parent().next().find('div').show(); 

.parent() получает родительский элемент .next() получает следующий sibling, например, NEXT td .find (селектор) позволяет найти что-то в этом браке.

Эта информация предназначена для тех случаев, когда вы сталкиваетесь с проблемами нескольких элементов и НЕ имеете ссылку на ссылку. В приведенном выше случае $ ('# javaRatingDiv'). Show(); будет работать отлично, как отметил Патрик.

+0

Это именно то, что я искал. Спасибо, Дэн. Он отлично работал. Цените объяснение, поскольку я довольно новичок в JQuery. –

+0

Поскольку это то, что вам нужно: одна вещь, чтобы сохранить в своем инструменте функцию .parents(). Если «td» не всегда является уровнем выше, то это будет работать: $ (this) .parents ('td: first'). Next(). Find ('div.classOfYourRateDiv'). Show() ; –

+0

+1 для примера обхода. У меня было такое чувство, что, возможно, и захотел, но направился к двери. :) – user113716

1

Поскольку div имеет идентификатор, вы можете получить доступ к нему напрямую.

$('#javaRatingDiv'); 

Это будет захватывать div с идентификатором 'javaRatingDiv'.

+0

Спасибо. Я действительно ищу для доступа к DIV без ID. Идентификатор, возможно, будет удален. Они будут загружены из базы данных, и каждый раздел не будет иметь уникальный идентификатор. Есть ли вообще доступ к этому, используя структуру DOM? Может быть, братья и сестры? –

Смежные вопросы