jquery select element

Question

Облицовка некоторых проблем с селекторами jQuery.

Мой HTML, как:

<form method="" action=""> 
    <p id="question_1"> 
     <h1 id="question">1. A Question</h1> 
     <div id="choices"> 
      <p id="option1"><input type="radio" id="option" name="q_1" value="1" />A</p> 
      <p id="option2"><input type="radio" id="option" name="q_2" value="2" />B</p> 
      <p id="option3"><input type="radio" id="option" name="q_3" value="3" />C</p>    
     </div> 
    </p>  
. 
. 
. 
</form> 

Есть п такие вопросы.

Я хочу выделить <p>, содержащий 3-й переключатель для каждого вопроса. Например,

p#question_1 > p#option3 
    p#question_2 > p#option3 
    p#question_3 > p#option3 

Как это сделать?

я что-то вроде этого пытаюсь, без какого-либо успеха:

$("form p#question_" + i).filter("p:eq(3)").addClass("correct"); 

Answer 1

Я хочу, чтобы выделить <p> содержащего кнопку 3rd радио для каждого вопроса.

Использование начать с ^ селектором с nth-child, как это:

$('p[id^="question"]:nth-child(3)').addClass('correct'); 

Что ^="question" делает то, что он выбирает все пункты, начиная с question текстом в их идентификаторах, а затем nth-child(3) используются для выбора третьего абзаца.

Дополнительная информация:

• Starts With Selector
• :nth-child Selector

Answer 2

Есть много способов сделать это, вот это хороший JQuery селекторы refcard, которые будут очень полезны для вас в будущее.

http://refcardz.dzone.com/refcardz/jquery-selectors

Answer 3

Если ваш третий ответ всегда правильно, вы можете выбрать что-то вроде этого, вместо:

<p class="first">Blah blah</p> 
<p class="second">Blah blah</p> 
<p class="third">Blah blah</p> 

Тогда просто:

$("p.third").addClass("correct"); 

Что следует надеяться соблазнить вас, чтобы получить избавиться от этих идентификаторов.

Answer 4

Можно ли добавить класс к третьей опции для каждого вопроса?

Answer 5

Я предполагаю, что вы хотите, чтобы это работало, если у вас есть много div с ответами в них? Украсьте каждый такой div DivChoices, а затем:

$(".DivChoices").each(function (index, item) { $("p", item).last().addClass('correct'); });