我的js表单验证时,无法在浏览器中弹出警示框,求大神解答?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了我的js表单验证时,无法在浏览器中弹出警示框,求大神解答?相关的知识,希望对你有一定的参考价值。

代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>表单验证</title><script type="text/javascript"> function userCheck() var uname=document.getElementById("username-id").value; var uemail=document.getElementsByName("useremail")[1].value; var upwd=document.getElementsByTagName("input")[2].value; //window.alert(uname+","+uemali+","+upwd) if(uname.length<1) window.alert("用户名不能为空"); return false; if(upwd.length<6) window.alert("密码长度不足六位"); return false; if(uemail.indexOf("@",0)==-1) window.alert("请输入正确的邮箱地址"); return false; </script></head><body> <form name="form" onsubmit="userCheck()"> 名字:<input type="text" name="username" id="username-id" style="visibility:visible"/><br /><br /> 邮箱:<input type="text" name="useremail"/><br /><br /> 密码:<input type="password" name="userpsd"/><br /><br /> <input type="submit" value="提交" /> <input type="reset" value="重置"/> </form></body></html>

错误一、var uemail = document.getElementsByName("useremail")[1].value;这里小标取错了,只有一个name等于useremail的,所以下标是0,而不是1。
错误二、form标签的onsubmit事件当不加上return,就算是验证不通过也会提交数据,所以onsubmit应该是:onsubmit="return userCheck()"。
具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证</title>
</head>
<body>
<form name="form" onsubmit="return userCheck()">
名字:<input type="text" name="username" id="username-id" style="visibility:visible"/><br/><br/>
邮箱:<input type="text" name="useremail"/><br/><br/>
密码:<input type="password" name="userpsd"/><br/><br/>
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
</form>

<script type="text/javascript">
function userCheck()
var uname = document.getElementById("username-id").value;
var uemail = document.getElementsByName("useremail")[0].value;
var upwd = document.getElementsByTagName("input")[2].value;
if(uname.length<1)
window.alert("用户名不能为空");
return false;

if(upwd.length<6)
window.alert("密码长度不足六位");
return false;

if(uemail.indexOf("@",0)==-1)
window.alert("请输入正确的邮箱地址");
return false;


</script>
</body>
</html>
参考技术A 注意获取邮箱值的这一行,你应该把
var uemail = document.getElementsByName("useremail")[1].value;
换成
var uemail = document.getElementsByName("useremail")[0].value;
因为useremail在你这个页面只有1个,所以取第0位的值

以上是关于我的js表单验证时,无法在浏览器中弹出警示框,求大神解答?的主要内容,如果未能解决你的问题,请参考以下文章

避免在 UWP 应用中弹出 Web 身份验证浏览器

怎么将java web项目出错中弹出的来自网页信息框关掉!

完美解决vue项目中弹出框滑动时,内部页面也跟着滑动问题

表单身份验证和 Windows 身份验证的混合?

在一般处理程序(ashx)中弹出js提示语

如何禁止 alert在浏览器中弹出信息。