onsubmit属性不起作用

Question

你好，我试图验证我的表单使用onsubmit属性。但它不起作用。而这个故事中最有趣的事情 - 这仅在两天前才正常运作。 表单标签：

<form action="../actionHandlers/registrationHandler.php" onsubmit="return validateRegistrationForm()" method="post" name="reg_form" enctype="multipart/form-data" id="reg_form"> 

验证功能：

function validateRegistrationForm() { 
    var errors = []; 
    if (document.forms['reg_form']['username'].value.length == 0) { 
     var usernameErrorMessage = localStorage.getItem('emptyLoginError'); 
     errors.push(usernameErrorMessage); 
    } 
    if (document.forms['reg_form']['password'].value.length == 0) { 
     var passwordErrorMessage = localStorage.getItem('emptyPasswordError'); 
     errors.push(passwordErrorMessage); 
    } 
    if (!validateEmail(document.forms['reg_form']['email'].value)) { 
     var emailErrorMessage = localStorage.getItem('emailInvalidError'); 
     errors.push(emailErrorMessage); 
    } 
    if (errors.length > 0) { 
     var htmlErrors = ''; 
     for (var i = 0; i < errors.length; i++) { 
      htmlErrors += errors[i] + "<br />"; 
     } 
     document.getElementById("error_message").innerHTML = htmlErrors; 

     return false; 
    } else { 

     return true; 
    } 
} 

哪里是我的错？请帮助）

验证电子邮件：

function validateEmail(email) { 
var pattern = /^([a-zA-Z0-9_.-])[email protected]([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/; 

return pattern.test(email); 
} 

输入：

<div> 
      <label for="username" id="username_label"><?php echo $languageArray['USERNAME'] ?></label><span id="required_mark">*</span><br/> 
      <input type="text" name="username" id="username_field" class="input_form_fields"> 
     </div> 

     <div> 
      <label for="password"><?php echo $languageArray['PASSWORD'] ?></label><span id="required_mark">*</span><br/> 
      <input type="password" name="password" id="password_field" class="input_form_fields"> 
     </div> 

     <div> 
      <label for="email"><?php echo $languageArray['EMAIL'] ?></label><span id="required_mark">*</span><br/> 
      <input type="text" name="email" id="email_field" class="input_form_fields"> 
     </div> 

Answer 1

试试这个代码，我已经测试它和它的工作：

<form action="../actionHandlers/registrationHandler.php" onsubmit="return validateRegistrationForm()" method="post" name="reg_form" enctype="multipart/form-data" id="reg_form"> 

<div> 
    <label for="username" id="username_label"><?php echo (isset($languageArray['USERNAME']) ? $languageArray['USERNAME'] : "email"); ?></label><span id="required_mark">*</span><br/> 
    <input type="text" name="username" id="username_field" class="input_form_fields"> 
</div> 

<div> 
    <label for="password"><?php echo (isset($languageArray['PASSWORD']) ? $languageArray['PASSWORD'] : "email"); ?></label><span id="required_mark">*</span><br/> 
    <input type="password" name="password" id="password_field" class="input_form_fields"> 
</div> 

<div> 
    <label for="email"><?php echo (isset($languageArray['EMAIL']) ? $languageArray['EMAIL'] : "email"); ?></label><span id="required_mark">*</span><br/> 
    <input type="text" name="email" id="email_field" class="input_form_fields"> 
</div> 
<input type="submit"> 
</form> 

而且JS：

function validateEmail(email) { 
    var pattern = /^([a-zA-Z0-9_.-])[email protected]([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/; 

    return pattern.test(email); 
} 


function validateRegistrationForm(e) { 
    var errors = []; 
    if (document.forms['reg_form']['username'].value.length == 0) { 
     var usernameErrorMessage = localStorage.getItem('emptyLoginError') ? localStorage.getItem('emptyLoginError') : "username error"; 
     errors.push(usernameErrorMessage); 
    } 
    if (document.forms['reg_form']['password'].value.length == 0) { 
     var passwordErrorMessage = localStorage.getItem('emptyPasswordError') ? localStorage.getItem('emptyPasswordError') : "password error"; 
     errors.push(passwordErrorMessage); 
    } 
    if (!validateEmail(document.forms['reg_form']['email'].value)) { 
     var emailErrorMessage = localStorage.getItem('emailInvalidError') ? localStorage.getItem('emailInvalidError') : "email error"; 
     errors.push(emailErrorMessage); 
    } 
    if (errors.length > 0) { 
     var htmlErrors = ''; 
     for (var i = 0; i < errors.length; i++) { 
      htmlErrors += errors[i] + "<br />"; 
     } 
     if(document.getElementById("error_message")){ 

      document.getElementById("error_message").innerHTML = htmlErrors; 
     } 
     return false; 
    } else { 

     return true; 
    } 
} 

我看到它的问题是由以下任一引起方式：

1. localStorage.getItem通知，你甚至不检查，看是否存在的关键。
2. echo $languageArray['PASSWORD']再次没有任何检查，虽然我敢肯定，它不是PHP的错误，但它很好检查之前，你的回声。
3. document.getElementById("error_message")，以及你使用innerHTML，但document.getElementById我的退货undefined。

结论：

的代码应该工作。

但是：

你说这工作之前，我想你已经触及了HTML在这种或那种方式，如果它不是HTML检查localStorage的键。