Javascript表單驗證不會返回任何東西

我有一個HTML表單，其中包含一些字段和一個驗證javascript的驗證字段，我的問題是js不會返回任何內容，並且雖然字段填充不屬性，但是提交會發送。Javascript表單驗證不會返回任何東西

這裏我的代碼示例：

HTML

<form method="post" action="action.php" onsubmit="return validate_form();"> 
     <table> 
      <tr> 
      <td> 
       <label class="standard_text"> 
        E-mail 
       </label> 
      </td> 
      <td><input class="textarea" required type="email" name="mail" id="mail" placeholder="E-mail"></label></td> 
      <td><div class="check_icon icon_yes" style="display:none" id="mail_ok_icon"></div></td> 
      <td><div class="check_icon icon_no" style="display:none" id="mail_no_icon"></div></label></td> 
      <td><div class="check_message" style="display:none" id="mail_message"><label class="important_text">The email format is not correct!</label></div></td> 
      </tr> 
     </table> 
     <input class="button_submit" type="submit" name="send_form" value="Register"/> 
</form>

的Javascript

function validate_form(){ 

    //email var 
    var mail = document.getElementById("mail").value; 
    var mail_ok_icon = document.getElementById("mail_ok_icon"); 
    var mail_no_icon = document.getElementById("mail_no_icon"); 
    var mail_message = document.getElementById("mail_message"); 

    //email format check 
    if ((/(.+)@(.+){2,}\.(.+){2,}/.test(mail)) || mail=="" || mail==null) { 
     mail_no_icon.style.display="block"; 
     mail_message.style.display="block"; 
     return(false); 

    } else { 
     mail_ok_icon.style.display="block"; 
    } 
}

所以我想，以顯示這取決於JavaScript的檢查，也元素如果對所有字段進行檢查，試圖不讓用戶發送信息不正確。

我錯過了什麼？

感謝

來源

2016-09-04 Aleix Gallet Segarra

的'else'部分不返回任何東西。這將使該函數隱式返回'undefined'。 – vlaz

我把它用下面的代碼工作 - ：

在原代碼的電子郵件輸入有required和type="email"從未叫初審的JavaScript代碼。

<html> 
<head> 
    <script type="text/javascript" src="test.js"></script> 
</head> 
<body> 
    <form method="post" action="action.php" onsubmit="return validate_form();"> 
     <table> 
      <tr> 
      <td> 
       <label class="standard_text"> 
       E-mail 
       </label> 
      </td> 
      <td><input class="textarea" name="mail" id="mail" placeholder="E-mail"></label></td> 
      <td><div class="check_icon icon_yes" style="display:none" id="mail_ok_icon"></div></td> 
      <td><div class="check_icon icon_no" style="display:none" id="mail_no_icon"></div></label></td> 
      <td><div class="check_message" style="display:none" id="mail_message"><label class="important_text">The email format is not correct!</label></div></td> 
     </tr> 
     </table> 
     <input class="button_submit" type="submit" name="send_form" value="Register"/> 
    </form> 
</body> 
</html>

現在這裏是JS代碼 - ：

function validate_form() { 
    //email var 
    var mail = document.getElementById("mail").value; 
    var mail_ok_icon = document.getElementById("mail_ok_icon"); 
    var mail_no_icon = document.getElementById("mail_no_icon"); 
    var mail_message = document.getElementById("mail_message"); 

    //email format check 
    if (!(/(.+)@(.+){2,}\.(.+){2,}/.test(mail)) || mail=="" || mail==null) { 
     mail_no_icon.style.display="block"; 
     mail_message.style.display="block"; 
     console.log('hi');   
     return false; 
    } else { 
     mail_ok_icon.style.display="block"; 
     return true; 
    } 
}

來源

2016-09-04 09:20:12

@AleixGalletSegarra @nitin因爲這些都是HTML標準，所以刪除'type =「email」'或'required'是不可取的，即使javascript被禁用，也可以按預期工作。您只需在正則表達式檢查和return語句之前更改'！'的js邏輯以更正您的代碼。 –

@AleixGalletSegarra如果工作，那麼你可能會接受答案。 –

謝謝，請試試這個;） @Nitin Misra「！記錄下那些名聲低於15的演員的投票，但不會改變公開顯示的帖子得分」 –

Javascript表單驗證不會返回任何東西

回答

相關問題