У меня есть следующий код:
<li>1. question 1</li> <li> <input type="radio" name="question1" id="sd1" value="1">Strongly Disagree <input type="radio" name="question1" id="d1" value="2">Disagree <input type="radio" name="question1" id="n1" value="3">Neither Agree Nor Disagree <input type="radio" name="question1" id="a1" value="4">Agree <input type="radio" name="question1" id="sa1" value="5">Strongly Agree </li> <br/><br/> <li>2. question 2 </li> <li> <input type="radio" name="question2" id="sd2" value="1">Strongly Disagree <input type="radio" name="question2" id="d2" value="2">Disagree <input type="radio" name="question2" id="n2" value="3">Neither Agree Nor Disagree <input type="radio" name="question2" id="a2" value="4">Agree <input type="radio" name="question2" id="sa2" value="5">Strongly Agree </li> <br/><br/> <li>3. question 3</li> <li> <input type="radio" name="question3" id="sd3" value="1">Strongly Disagree <input type="radio" name="question3" id="d3" value="2">Disagree <input type="radio" name="question3" id="n3" value="3">Neither Agree Nor Disagree <input type="radio" name="question3" id="a3" value="4">Agree <input type="radio" name="question3" id="sa3" value="5">Strongly Agree </li> <br/><br/> <input type="submit" value="Submit" name="Submit" id="Submit" /> У меня есть 30 вопросов. Мое требование состоит в том, что пользователь должен ответить на все 30 вопросов.
Как написать функцию javascript так, чтобы mesage показывался всем пользователям, если он не отвечает ни на один из вопросов. РЕДАКТИРОВАТЬ:
Проблема с моим javascript i sthis:
if ( (thisfrm.question3[0].checked == false) || (thisfrm.question3[1].checked == false) || (thisfrm.question3[2].checked == false) || (thisfrm.question3[3].checked == false) || (thisfrm.question3[4].checked == false)) { alert('Please answer question 1'); return false; }
вышеуказанный код повторяется для каждого вопроса без цикла. т.е. он написан для каждого вопроса. но даже когда все вопросы отвечают, он все еще отображается. Ответьте на вопрос 1
Этот метод использует jQuery и проверяет неконтролируемые переключатели в наборе ответов
HTML – добавьте класс на свои вопросы <li>
<li>1. question 1</li> <li class="option"> <input type="radio" name="question1" id="sd1" value="1">Strongly Disagree <input type="radio" name="question1" id="d1" value="2">Disagree <input type="radio" name="question1" id="n1" value="3">Neither Agree Nor Disagree <input type="radio" name="question1" id="a1" value="4">Agree <input type="radio" name="question1" id="sa1" value="5">Strongly Agree </li>
Javascript
// Delegate submit action $(document).on('submit', 'form', function () { var validate = true; var unanswered = new Array(); // Loop through available sets $('.option').each(function () { // Question text var question = $(this).prev(); // Validate if (!$(this).find('input').is(':checked')) { // Didn't validate ... dispaly alert or do something unanswered.push(question.text()); question.css('color', 'red'); // Highlight unanswered question validate = false; } }); if (unanswered.length > 0) { msg = "Please answer the following questions:\n" + unanswered.join('\n'); alert(msg); } return validate; });
Пример здесь http://fiddle.jshell.net/6jNpQ/2/
Ниже код более простой и чистый для даже больших участников
if (!$("input[name='html_elements']:checked").val()) { alert('Nothing is checked!'); } else { alert('One of the radio buttons is checked!'); }
ознакомьтесь с этим ниже.
Проверь это. Вместо проверки каждого элемента вы можете использовать что-то вроде этого
for(var i = 1 ; i <= 30 ; i++) { var radios = document.getElementsByName('question'+i); var checked = false; for (var j = 0, length = radios.length; j < length; j++) { if (radios[j].checked) { checked = true; break; } } if(!checked) { alert('Please answer question '+i); break; } }
Похоже, вы используете только javascript. Я рекомендую вам добавить jQuery, чтобы упростить запись javascript.
Во всяком случае, только с помощью javascript вы можете попробовать следующее:
var questions = 30; var answer_checked = false; var one_not_checked = false; for (var i = 1; i <= questions; i++) { for (var j=0; j < document.getElementsByName('question'+i).length; j++) { answer_checked = answer_checked || (thisfrm['question'+i][j].checked == true); } one_not_checked = one_not_checked || !answer_checked; answer_checked = false; } if (one_not_checked) { // your message to the user as one answer is not checked }
Что-то вроде этого?
if ($('input[type=radio]:checked').length <= 0) { alert("No radio checked") }
Или сделать это по имени?
if ($('input[name=question1]:checked').length <= 0) { alert("No radio checked") }
Вы должны использовать логический оператор && для вашего условия
if ( (thisfrm.question3[0].checked == false) && (thisfrm.question3[1].checked == false) && (thisfrm.question3[2].checked == false) && (thisfrm.question3[3].checked == false) && (thisfrm.question3[4].checked == false) )
Вот ответ на ваш вопрос. Вы также можете проверить это .
Просто используя этот код, я написал его для вашего кода. См. Ниже
Код HTML
<form method="POST" action="/echo/html/?html=;delay=3;"> <ul> <li class="question">1) question 1</li> <li class="answers"> <input type="radio" name="question1" id="11" value="1" />Strongly Disagree <input type="radio" name="question1" id="12" value="2" />Disagree <input type="radio" name="question1" id="13" value="3" />Neither Agree Nor Disagree <input type="radio" name="question1" id="14" value="4" />Agree <input type="radio" name="question1" id="15" value="5" />Strongly Agree </li> <li class="question">2) question 2</li> <li class="answers"> <input type="radio" name="question2" id="21" value="1" />Strongly Disagree <input type="radio" name="question2" id="22" value="2" />Disagree <input type="radio" name="question2" id="23" value="3" />Neither Agree Nor Disagree <input type="radio" name="question2" id="24" value="4" />Agree <input type="radio" name="question2" id="25" value="5" />Strongly Agree </li> <li class="question">3) question 3</li> <li class="answers"> <input type="radio" name="question3" id="31" value="1" />Strongly Disagree <input type="radio" name="question3" id="32" value="2" />Disagree <input type="radio" name="question3" id="33" value="3" />Neither Agree Nor Disagree <input type="radio" name="question3" id="34" value="4" />Agree <input type="radio" name="question3" id="35" value="5" />Strongly Agree </li> </ul> <input type="submit" value="Submit" name="Submit" id="Submit" /> </form>
Код Javascript
$("form").submit(function () { var allChecked = true; $('li.answers').each(function () { if (!$(':radio', this).is(':checked')) { allChecked = false; return false; } }); if (!allChecked) { alert('Please fill the form completely...'); return false; } else { alert('You have filled the complete form.'); } });