Javascript 添加验证以查看是否未选中单选按钮
我有以下代码:Javascript 添加验证以查看是否未选中单选按钮,javascript,php,html,Javascript,Php,Html,我有以下代码: <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="q
<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" />
以上代码对每个问题都重复,没有循环。i、 e.它是为每个问题编写的。但即使回答了所有问题,它仍然会显示“请回答问题1”类似的内容
if ($('input[type=radio]:checked').length <= 0) {
alert("No radio checked")
}
if($('input[type=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) )
检查此项。您可以使用类似以下内容来代替验证每个元素
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;
}
}
for(var i=1;i看起来您只使用了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
}
var问题=30;
var-answer\u checked=假;
var one_not_checked=false;
对于(var i=1;i,此方法使用jQuery并检查一组答案中未选中的单选按钮
HTML-在问题中添加类
<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>
示例这里是您问题的答案。您也可以查看
仅使用此代码,我就为您的代码编写了此代码。请参见下文
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>
$("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.');
}
});
下面的代码对于大人物来说更简单、更清晰
if (!$("input[name='html_elements']:checked").val()) {
alert('Nothing is checked!');
}
else {
alert('One of the radio buttons is checked!');
}
看看下面的小提琴演示
通过javascript访问
function validate(){
if (checkRadio("question1") && checkRadio("question2") && checkRadio("question3")){
return true;
}else{
alert("Please answer all Questions!");
return false;
}
}
function checkRadio(name){
var radio = document.forms.myForm[name];
for (var option in radio){
if(radio[option].checked){
return true;
}
}
return false;
}
你可以用这个:凯拉:谢谢你的回复。有没有一种方法,我可以给每个未回答的问题单独发出警告消息??例如:如果第一个问题没有回答,提醒用户第一个问题需要回答等等。这是非常创新的,让用户知道确切的问题。我已经接受了你的建议answer@user2822187很高兴这对你有帮助.:):)提供完整的问题而不仅仅是问题编号很好。这很有效,谢谢!!我可以把它放在循环中,这样我就不用写30个问题了?每个问题的名称属性命名为:问题1、问题2、问题3……等等
$("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.');
}
});
if (!$("input[name='html_elements']:checked").val()) {
alert('Nothing is checked!');
}
else {
alert('One of the radio buttons is checked!');
}
function validate(){
if (checkRadio("question1") && checkRadio("question2") && checkRadio("question3")){
return true;
}else{
alert("Please answer all Questions!");
return false;
}
}
function checkRadio(name){
var radio = document.forms.myForm[name];
for (var option in radio){
if(radio[option].checked){
return true;
}
}
return false;
}