JavaScript表单验证+根据没有ID的输入名称获取表单值

我试图做一个表单验证，但它似乎并没有工作，我的元素没有ID，所以我抓住他们通过getElementsByName & getElementsByClass功能（通过Robert Nyman书面）JavaScript表单验证+根据没有ID的输入名称获取表单值

我的JS：

 window.onload = function() {  
     var feedbackForm = getElementsByClassName("formBuilder"), 
      feedbackName = document.getElementsByName("form-name")[0], 
      feedbackLocation = document.getElementsByName("form-location")[0], 
      feedbackEmail = document.getElementsByName("form-email")[0], 
      feedbackComment = document.getElementsByName("form-comment")[0]; 

     feedbackForm.onsubmit = function() { 

      var errors, errorDiv, errorUL = []; 

      // check all the fields 
      if (!feedbackName.value.match(/\b\w+\b/)) { errors.push("Please enter your full name"); } 
      if (!feedbackLocation.value.match(/\b\w+\b/)) { errors.push("Please enter your location"); } 
      if (!feedbackEmail.value.match(/^([0-9a-zA-Z]+[\-._+&])*[0-9a-zA-Z_][email protected]([\-0-9a-zA-Z]+[.])+[a-zA-Z]{2,6}$/)) { errors.push("Please enter a correct email address"); } 
      if (!feedbackComment.value.match(/\b\w+\b/)) { errors.push("Please make a comment"); } 

      // if there are errors, display them and cancel submit 
      if (errors.length) { 
       errorDiv = document.querySelector('#feedback-errors') || appendDiv(feedbackForm, {id: 'feedback-errors', innerHTML: '<ul></ul>'}); 
       errorUL = errorDiv.querySelector('ul'); 
       errorUL.innerHTML = errors.map(function (v) { 
        return "<li>#{v}</li>"; 
       }).join(''); 
       return false; 
      } 
      // submit the form 
      return true;  
     };   
    }

这里是我的小提琴显示我的加价& JS：http://jsfiddle.net/calebo/rBnwh/

任何sugge关于如何更好地撰写js的提法也受到欢迎。

ps：不允许使用jQuery。

来源

2011-08-10 calebo

有点偏题;你没有机会像jQuery一样使用库吗？这会让这个问题变得更容易:) – Pelshoff

不幸的是，不能用jQuery验证插件做到这一点。 – calebo

http://jshint.com/ - >'getElementsByClassName'未定义，'appendDiv'未定义。 – Incognito

方法getElementsByClassName和getElementsByName返回一个元素数组，因此您应该使用索引来使用特定的元素。

来源

2011-08-10 07:10:57 Kangkan

好吧我更新了我的js引用getElementsbyName，但是getelementsByClassName应该不需要根据自定义书写函数的索引？ – calebo

您所指定的链接中的页面声明：“利用本机getElementsByClassName和XPath支持，并回退到常规循环。返回实数组而不是节点列表。”所以它是一个真正的数组，从数组访问需要索引。 – Kangkan

@caleb：你做了一些改变吗？ – Kangkan

JavaScript表单验证+根据没有ID的输入名称获取表单值

回答

相关问题