Как проверить, установлен ли переключатель в каждой группе в jQuery? - PullRequest
Новая
       29

Как проверить, установлен ли переключатель в каждой группе в jQuery?

17 голосов
/ 24 августа 2010

Несколько групп или переключателей 

<h1>Question 1</h1>
<input type="radio" name="radio1" value="false" />
<input type="radio" name="radio1" value="true" /> 

<h1>Question 2</h1>
<input type="radio" name="radio2" value="false" />
<input type="radio" name="radio2" value="true" />

Как проверить в jQuery, что переключатель в каждой группе отмечен?

Спасибо.

Ответы [ 4 ]

22 голосов
/ 24 августа 2010

Вот как бы я это сделал: 

var all_answered = true;
$("input:radio").each(function(){
  var name = $(this).attr("name");
  if($("input:radio[name="+name+"]:checked").length == 0)
  {
    all_answered = false;
  }
});
alert(all_answered);

Таким образом, вам не нужно полагаться на родственные или родительские теги. Если ваши переключатели перепутаны с каким-либо тегом, он все равно будет работать. Вы можете поиграть с ним .

2 голосов
/ 24 августа 2010

Вы можете просмотреть каждый вопрос (<h1>) и просмотреть его ответы, используя .nextUntil() с .filter(), чтобы увидеть, есть ли :checked те, как это: 

var noAns = $("h1").filter(function() {
              return $(this).nextUntil("h1").filter(":checked").length == 0;
            });

Это вернет все вопросы, для которых не выбрано радио, вы можете проверить .length этого, если хотите увидетьесли любой не имеет ответов, например: 

if(noAns.length > 0) { 
  alert(noAns.length + " question(s) don't have answers!"); 
}

Вы можете попробовать здесь .

Вытакже можно немного расширить это, например, выделив пропущенные вопросы: 

if(noAns.css({ color: "red" }).length > 0) {

и использовать $("h1").css({ color: "" }), чтобы очистить его в следующем раунде, , вы можете попробовать здесь .

1 голос
/ 17 сентября 2013

Оберните каждую радиогруппу с помощью form или div: 

<div id="question1">
    <h1>Question 1</h1>
    <input type="radio" name="radio1" value="false" />
    <input type="radio" name="radio1" value="true" />
</div>

<div id="question2">
    <h1>Question 2</h1>
    <input type="radio" name="radio2" value="false" />
    <input type="radio" name="radio2" value="true" />
</div>

Затем в jQuery: 

if ($('#question1 input[type=radio]:checked')[0] != undefined && $('#question2 input[type=radio]:checked')[0] != undefined) {
    ...
}
0 голосов
/ 08 декабря 2017

Я проголосовал за ответ "GG".Однако вам не нужно менять HTML.

Просто выберите [имя] (которое должно быть уникальным): 

if ($("input[name='radio1']:checked")[0] != undefined && 
    $("input[name='radio2']:checked")[0] != undefined) {
  ...
}
...