Javascript函數沒有響應

我有一個外部js文件中的函數應該驗證我的虛擬站點上的某些字段，但它似乎沒有響應。Javascript函數沒有響應

我的瀏覽器控制檯顯示沒有錯誤，所以我不確定問題出在哪裏，因爲我確定我正在調用我的函數，並且調用它的腳本部分也是正確的。

function checkFields(){ 
 

 
    var fname = document.getElementById("firstname").value; 
 
    var lname = document.getElementById("lastname").value; 
 
    var mail = document.getElementById("email").value; 
 
    var phone = document.getElementById("phonenumber").value; 
 
    var pw = document.getElementById("password").value; 
 
    var cpw = document.getElementById("cpassword").value; 
 

 
    if ((fname == "") || (fname == null)) { 
 
    return alert('Error', 'Missing Fields'); 
 
    } 
 
    if ((lname == "") || (lname == null)) { 
 
    return alert('Error', 'Last Name Missing'); 
 
    } 
 
    if ((mail == "") || (mail == null)) { 
 
    return alert('Error', 'Email Missing'); 
 
    } 
 
    if ((phone == "") || (phone == null)) { 
 
    return alert('Error', 'Phone Missing'); 
 
    } 
 
    if ((pw == "") || (pw == null)) { 
 
    return alert('Error', 'Enter a password'); 
 
    } 
 
    if ((cpw == "") || (cpw == null)) { 
 
    return alert('Error', 'Confirm your password please'); 
 
    } 
 
    if (pw != cpw) { 
 
    return alert('Error', 'Passwords do not match'); 
 
    } 
 
    return false; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>Website</title> 
 
    <link rel="stylesheet" type="text/css" href="practice.css"> 
 
</head> 
 
<body> 
 
<div style="width:100%"> 
 
    <div id="header"> 
 
     MINIMAL STORE <br /> 
 
    
 
     <div id="head"> 
 
     
 
     </div> 
 
    </div> 
 
    <div id ="left"> 
 
     <div><b>Main Menu</b></div> 
 
     <li><a href="nothing">Home</a></li> 
 
     <li><a href="nothing">Register</a></li> 
 
     <li><a href="nothing">Shop</a></li> 
 
     <li><a href="nothing">My Cart</a></li> 
 
     <li><a href="nothing">Checkout</a></li> 
 
    </div> 
 
    <div id="main"> 
 
    <h1>Register Now!!!</h1> 
 
    <form action="" method="post" onsubmit="return checkFields()"> 
 
     First name:<br> 
 
     <input type="text" id="firstname"> 
 
     <br> 
 
     Last name:<br> 
 
     <input type="text" id="lastname"> 
 
     <br> 
 
     Email:<br> 
 
     <input type="text" id="email"> 
 
     <br> 
 
     Phone Number<br> 
 
     <input type="text" id="phonenumber"> 
 
     <br><br> 
 
     <form action=""> 
 
      Password: <input type="password" id="password"><br> 
 
      Confirm Password: <input type="password" id="cpassword"> 
 
     </form> 
 
     <input type="submit" value="Submit"> 
 
    </form> 
 
    </div> 
 
    
 
    <div id="footer"> 
 
    </div> 
 
</div> 
 
<script type="text/javascript" src="prac.js"></script> 
 
</body> 
 
</html>

來源

2016-07-31 xan

你必須在另一個<form>一個<form>這是造成表單不能正常提交：

<form action=""> 
    Password: <input type="password" id="password"><br> 
    Confirm Password: <input type="password" id="cpassword"> 
</form>

Forms CANNOT be nested。只需移除密碼錶格，表格將正確提交給您的功能。

邊欄：

請注意alert()不接受多個參數。你也應該這樣做：

alert("Error\nMissing Fields"); 
return false;

而在函數結束時，你應該返回true（提交表單）。

來源

2016-07-31 01:16:37 FrankerZ

謝謝你這個作品！ – xan

Javascript函數沒有響應

回答

相關問題