我的表单验证功能失败了什么？答案

【问题标题】：What is failing in my form validation function?我的表单验证功能失败了什么？
【发布时间】：2013-03-14 05:32:01
【问题描述】：

所以我尝试创建一个函数来循环遍历表单的元素并检查元素的长度，如果是，则更改类，以便它们可以具有不同的样式。我假设的代码可以工作，并且我的控制台中没有任何错误，所以我无法确定到底出了什么问题。如果有人能告诉我为什么这不起作用或如何解决它，那就太棒了！谢谢！

function validate_form(){
 var form = document.forms['form_name']; //store form into a variable
 var validated = true; // store return value for onsubmit attribute
     for(i=0; i<form.elements.length; i++){
      if(form.elements[i].value.length){  // check if form elements are empty
           form.elements[i].className = "validate_failed";  // if elements are empty, add a class that will style them
           validated = false;
           return validated;
    } else{
        validated = true;
        return validated;
    }
    return validated;
}
return validated;
}

【问题讨论】：

可能是缺少var i;，而您返回的频率太高了。
循环不会在出现的开头设置 i 吗？
有什么问题？究竟会发生什么？样式没有得到应用吗？样式是否在错误的时间应用？请具体。
绝对没有任何反应！提交表单就好像该函数甚至没有被调用，但在我的表单中，我的表单元素中有 onsubmit="return validate_form()" 。所以我不明白，
你能在你的 for 循环开始之前发出警报，看看它是否能达到这个功能吗？

标签： javascript html forms loops validation

【解决方案1】：

以下代码适用于空元素

if(!form.elements[i].value.length){

或

if(form.elements[i].value.length === 0){

【讨论】：

【解决方案2】：

试试

function validate_form(){
  var form = document.forms['form_name']; //store form into a variable
  for(var i=0; i<form.elements.length; i++){
    if(form.elements[i].value.length===0){  // check if form elements are empty
      form.elements[i].className = "validate_failed";  // if elements are empty, add a class that will style them
      return false;
  }
  return true;
}

假设

<form onsubmit="return validate_form()" ...

或者让它不显眼

window.onload=function() {
  document.forms['form_name'].onsubmit=function() {
    for(var i=0; i<this.elements.length; i++){
      this.elements[i].className = "";
      if(this.elements[i].value.length===0){  // check if form elements are empty
        this.elements[i].className = "validate_failed";  // if elements are empty, add a class that will style them
        return false;
      }
      return true;
    }
  }
}

【讨论】：

就是这样！实际上，我在这里等待更多答案时正在更改我的原始代码，所以我在阅读您的答案之前就得到了它！但是我们的代码是相同的，这意味着我们都是对的。非常感谢您的帮助！

【解决方案3】：

因为您在循环的第一次运行期间返回validated，所以您只会检查表单的第一个元素。您只需要设置validated，并在循环后返回它（或者在您第一次将其设置为 false 时返回，具体取决于您要执行的操作）。

另外，就像 Joe 评论的那样，您应该拥有 var i 而不仅仅是 i，这样 i 就不是全局的。

【讨论】：