移动事件处理程序，单独的文件

Question

我目前使用的HTML代码：

<form onsubmit="return validateForm()" action="page.html" > 
Name: <input type="text" id="name" /><br /> 
Email: <input type="text" id="email" /><br /> 
<input type="submit" value="Submit" /> 
</form> 

但我想我的事件处理程序移动到我的单独的JavaScript，到名为启动功能。我的JavaScript看起来像这样：

function formValidator(){ 

    var name = document.getElementById("name"); 
    var email = document.getElementById("email"); 


    if(isAlphabet(name, "Fill in name")) 
    { 

     if(emailValidator(email, "Fill in email")) 
     { 
      return true; 
     } 
    } 


    return false; 

} 

function isAlphabet(elem, helpMsg) 
{ 
    var alphaExp = /^[a-zA-Z]+$/; 
    if(elem.value.match(alphaExp)) 
    { 
     return true; 
    } 
    else 
    { 
     alert(helpMsg); 
     elem.focus(); 
     return false; 
    } 
} 

function emailValidator(elem, helpMsg) 
{ 
    var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/; 
    if(elem.value.match(emailExp)) 
    { 
     return true; 
    } 
    else 
    { 
     alert(helpMsg); 
     elem.focus(); 
     return false; 
    } 
} 


function initiate { 
    // .. 
} 
window.onload = initiate; 

到目前为止，我只找到了如何编写代码来重定向到新的网页，但它不检查，这是一个有效的代码。我用这个：

HTML

<form id="form"> 
Name: <input type="text" id="name" /><br /> 
Email: <input type="text" id="email" /><br /> 
<input type="submit" value="Submit" /> 
</form> 

的Javascript

document.getElementById("form").action = "page.html"; 

但我无法弄清楚如何写这样既.action="page.html"和return validateForm()工作。

Answer 1

你的形式需要一个id：

<form id="form"> 
Name: <input type="text" id="name" /><br /> 
Email: <input type="text" id="email" /><br /> 
<input type="submit" value="Submit" /> 
</form> 

单独的JavaScript文件：

function initiate() 
{ 
    var form = document.getElementById("form"); 
    form.action = "page.html"; 
    form.onsubmit = function validateForm() 
    { 
     var name = document.getElementById("name"); 
     var email = document.getElementById("email"); 


     if(isAlphabet(name, "Fill in name")) 
     { 

      if(emailValidator(email, "Fill in email")) 
      { 
       return true; 
      } 
     } 

     return false; 
    }; 
} 

window.onload = initiate; 

确保validateForm()函数返回false，如果事情没有验证。