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函数没有响应

回答

相关问题