多个文本框的 Javascript 验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8747328/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript validation for multiple textboxes
提问by Dan
I am having some trouble figuring out how to validate my textboxes using js. I have 10 textboxes, the user can fill out any number 1-10, but cant fill out 0. Here is the js that I have written, but it only returns true if all 10 textboxes are filled, rather than just checking if one is filled.
我在弄清楚如何使用 js 验证我的文本框时遇到了一些麻烦。我有10个文本框，用户可以填写1-10中的任意数字，但不能填写0。这是我写的js，但是只有当所有10个文本框都填满时才返回true，而不是仅仅检查一个是不是填充。
function submitIt() {
if (document.isForm.Student_ID.value == null) {
alert ("You must enter a Colleague ID.");
return false;
} else {
return true;
}
}
And here is the form.....
这是表格.....
<form name="isForm" onSubmit="return submitIt()">
<input name="Student_ID" type="text" id="idField1" />
<input name="Student_ID" type="text" id="idField2" />
<input name="Student_ID" type="text" id="idField3" />
<input name="Student_ID" type="text" id="idField4" />
<input name="Student_ID" type="text" id="idField5" />
<input name="Student_ID" type="text" id="idField6" />
<input name="Student_ID" type="text" id="idField7" />
<input name="Student_ID" type="text" id="idField8" />
<input name="Student_ID" type="text" id="idField9" />
<input name="Student_ID" type="text" id="idField10" />
<input name="SUBMIT" type="submit" />
</form>
I realize that I could change all of the names, and check each one, but I am trying to avoid that much clutter in my code, and am curious the best way to do this. Any help is appreciated, thanks!
我意识到我可以更改所有名称，并检查每个名称，但我试图避免代码中出现那么多混乱，并且很好奇做到这一点的最佳方法。任何帮助表示赞赏，谢谢！
回答by Adam Rackis
You can get a collection of all these textboxes with document.getElementsByName. Then loop through them, and make sure at least one is filled in:
您可以获得所有这些文本框的集合document.getElementsByName。然后循环遍历它们，并确保至少填写一个：
var allTbs = document.getElementsByName("Student_ID");
var valid = false;
for (var i = 0, max = allTbs.length; i < max; i++) {
if (allTbs[i].value) {
valid = true;
break;
}
}
回答by abuduba
Function is iterating by all of the student text boxes and return true if some element is filled out. Protected against that if input contain only spaces :)
函数正在迭代所有学生文本框，如果填写了某些元素，则返回 true。如果输入仅包含空格，则可以防止这种情况:)
function submitIt() {
for( var i = 0, t = document.getElementsByName( "Student_ID" ), l = t.length; i < l; i++ )
if( t[i].value && !/^\s+$/.test( t[i].value ) )
return true;
return false
}
Demo on: http://jsfiddle.net/hhD2x/
回答by Poojan Dave
you can use jquery. add common class name for all your textboxes i.e.
你可以使用jquery。为所有文本框添加通用类名，即
<input name="Student_ID" type="text" id="idField1" class="student" />
now in js function
现在在 js 函数中
function submit()
{
$('.student').each(function() {
if($(this).val() == '' || $(this).val() == null)
{
// your error message
return false;
}
}
}
this function check all the elements with student class.
此函数检查学生类的所有元素。
回答by praveen acha
$('input[type="text"], select,
:input[type="date"],
:input[type="email"],
:input[type="radio"]').each(function () {
if ($.trim($(this).val()) == '' ) {
// your error message here
isValid = false;
}
});
