<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0px auto; padding:0px; font-family:微软雅黑; font-size:14px}
</style>
</head>
<body>
<form action="lizi1.html" method="post"><!--form是表单 action“进入到哪个页面”-->
<!--非空验证-->
<input type="text" name="uid" id="uid" onblur="Check() " /><!--onblur 失去焦点的意思，比如正在输入鼠标点到其他方面啦，就会出现一个对话框提示输入不正确-->
<!--相等验证-->
<input type="text" name="pw1" id="pw1"/>
<input type="text" name="pw2" id="pw2"/>
<!--范围验证-->
<input type="text" name="age" id="age" />
<!--特殊格式验证（正规格式）-->
<input type="text" name="email" id="email" /><!--email是邮箱的意思借用这个单词做id名-->
<input type="submit" value="确认" id="btn" onclick="return Check()" /><!--如果想阻止表单元素加onclick="return true" return是点击事件返回值 true是可以提交 false就是不能提交 点击事件先执行，提交的时候是根据返回值来判断 -->
</form>
</body>
<script type="text/javascript">
/*
//非空验证 就是判断用户输入的内容
function Check()
{
//取到用户输入的值给v， value是值
var v = document.getElementById("uid").value;
//先对值进行验证，判断用户输入的值有没有
if(v.trim().length==0)//length 取字符串的长度，是不是等于零，如果客户什么也没输入不就等于零吗。//trim()去除前后空格，在计算机方面空格也是一个字符。
{
alert("用户名不能为空");//输出一下提示用户
return false; //阻止用户输入不正确；
}
else //要是输入的正确不为空就进去
{
return true;
}
}
*/
<!--相等验证-->
function Check()
{
var v1 = document.getElementById("pw1").value;//取出第一个文本框的值，
var v2 = document.getElementById("pw2").value;//取出第二个文本框的值；
if(v1==v2)//判断第一个值等不等于第二个值，也就判断客户两次输入的是否一致。
{
return true; 相同就是通过
}
else //不相同就是执行下面
{
alert("两次输入的密码不相同"); //输出提示
return false;//因为输入的不一致，这里必须阻挡一下。
}
}
<!--范围验证-->
/* function Check()
{
var v = parseInt( document.getElementById("age").value);//parseInt 他是转成整数的意思。输入过来的值给v。以免会是字符串；用这个单词转一下，
if( v>=18 && v<=50) //判断是否在18到50岁年龄范围内；
{
return true;//满足进入，
}
else
{
alert("输入的年龄不在范围内");
return false;//不满足阻挡
}
}*/
<!--特殊格式验证 又称（正规格式）-->
function Check()
{
var v = document.getElementById("email").value;
//字符串有个方法match() 需要一个正规表达式作为参数，如果匹配成功，返回匹配到的内容，如果匹配失败返回null
if(v.match(/^w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$/)==null) //验证Email地址
{
alert("输入的邮箱格式不正确")
return false;
}
else
{
return true;
}
}
</script>
</html>