【发布时间】:2019-07-09 09:17:56
【问题描述】:
抱歉,如果标题设置不正确,因为我不知道是什么原因造成的,但我的循环总是会导致“错误”语句。
直截了当,这里是code,下同,如果有人喜欢在Codepen中查看..
function Validation() {
if(!ValidateForm()) {
document.getElementById("errorBox").innerHTML = "Please double check, that you have answered all the questions and try again."
return false;
} else {
document.getElementById("errorBox").innerHTML = ""
alert("Thank you for your cooperation");
}
}
function ValidateForm() {
var a = document.getElementsByName('Activity');
var v = document.getElementsByName('Volunteers');
//var e = document.getElementsByName('Name');
for (var i = 0; i<a.length; i++) {
if (a[i].type == 'checkbox') {
if (a[i].checked) {
for (var j = 0; j<v.length; j++) {
if (v[j].type == 'checkbox') {
if (v[j].checked) {
alert("it werks!!")
return true;
}
}
}
return true;
} else {
return false;
}
}
}
}
<form id="frmForm" name="frmForm" action="#" method="post" onsubmit="return Validation()">
<div class="row" style="margin-top: 20px;">
<div class="col-sm-12">
<div class="form-group">
<p>
<b>1. Which of the volunteer jobs did you like the most in the year 2018?</b>
</p>
<p style="margin-left: 16px;">
(You can choose one or more options as your answer)
</p>
<div style="margin-left: 35px;">
<input type="checkbox" id="Activity1" name="Activity" value="supplies" > 1<br>
<input type="checkbox" id="Activity2" name="Activity" value="food" > 2<br>
<input type="checkbox" id="Activity3" name="Activity" value="plastic" > 3<br>
<input type="checkbox" id="Activity4" name="Activity" value="clean" > 4<br>
<input type="checkbox" id="Activity5" name="Activity" value="painting" > 5<br>
<input type="checkbox" id="Activity6" name="Activity" value="zmps" > 6<br>
<input type="checkbox" id="Activity7" name="Activity" value="sumica" > 7<br>
<input type="checkbox" id="Activity8" name="Activity" value="blood" > 8<br>
<input type="checkbox" id="Activity9" name="Activity" value="volunteer" > 9<br>
</div>
</div>
</div>
</div>
<div class="row" style="margin-top: 20px;">
<div class="col-sm-12">
<div class="form-group">
<p>
<b>2. How much time are you prepared to spend as volunteer?</b>
</p>
<p style="margin-left: 16px;">
(You can only choose one option as your answer)
</p>
<div style="margin-left: 35px;">
<input type="radio" id="Volunteers1" name="Volunteers" value="oneWeek" > 1<br>
<input type="radio" id="Volunteers2" name="Volunteers" value="fiveWeek" > 2<br>
<input type="radio" id="Volunteers3" name="Volunteers" value="oneMonth" > 3<br>
<input type="radio" id="Volunteers4" name="Volunteers" value="fivemonth" > 4<br>
<input type="radio" id="Volunteers5" name="Volunteers" value="halfYear" > 5<br>
<input type="radio" id="Volunteers6" name="Volunteers" value="twoYear" > 6<br>
<input type="radio" id="Volunteers7" name="Volunteers" value="other" >
<input type="text" placeholder="other" /><br>
</div>
</div>
</div>
</div>
<button style="margin-top:30px;"type="submit" id="Submit" name="Submit">Send me away</button>
<div id="errorBox" style="margin-bottom:50px; color: red"></div>
</form>
我想做的是创建一个检查表单的函数。当然,给定的代码只是一个演示,因为我的表单更广泛。 该代码应该检查一个答案,如果检查,检查下一个,依此类推...... 我试图将 if 语句分开,但这只会导致在检查第一个答案后,代码会发送消息,就好像整个表单都已填写一样。
当我们这样做时,如果一个表单有一个带有复选框答案的问题,说其他(写下你的答案),我将如何编写一个代码,首先检查复选框是否被选中,然后检查输入是否也给了?
我将非常感谢您在问题的第二部分提供的任何帮助,以及在第一部分发现错误并纠正我:)
编辑:: 使用 console.log 测试了代码,只有在第一个问题中的所有复选框和第二个问题中的一个单选被选中后,表单才被标记为正确回答。
另一个结论,似乎出于某种原因,仅对于第一个问题的某些答案,代码会认为它们没有被检查,而对于其他人(如第一个答案),代码会接受它并继续以正确回答的形式.对此有何解释?
【问题讨论】:
-
如果投了这个问题-1的人能指出困扰他们的问题,我将不胜感激,这样我就可以了解我做错了什么,否则这种举动实际上没有任何意义。 .
-
也许这个stackoverflow.com/questions/20068487/…可以帮到你!
-
@MariaIrudayaRegilanJ,谢谢,马上去看看。
标签: javascript html forms if-statement checkbox