<body>
<form method="post" action="https://www.baidu.com/">
<p>姓名：<input type="text" size="24" name="userName"></p>
<p>密码<input type="password" size="24" name="pwd"></p>
<p>确认密码<input type="password" size="24" name="pwd1"></p>
<p>电子邮箱：<input type="email" size="24" name="em" value="请输入正确的电子邮箱" id="but"> (必须包含@和.字符)</p>
<input type="submit" value="提交" id="sub">
</form>
<script type="text/javascript" src="../JS/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
$("form").submit(function(){
//姓名中不能有数字，且不能为空
var name=$("[name=userName]").val();
//不能为空
if(name==""){
alert("姓名不能为空！");
return false;
}
//用for循环判断每个字符不能有数字
for(var i=0;i<name.length;i++){
var a=name.substring(i,i+1);
if(isNaN(a)==false){
alert("姓名中不能包含数字！");
return false;
}
}
判断密码不能为空
var pwd=$("[name=pwd]").val();
if(pwd==""){
alert("密码不能为空！");
return false;
}
判断密码长度要大于6
if(pwd.length<6){
alert("密码必须大于6位！");
return false;
}
确认密码，并且不能为空
var pwd1=$("[name=pwd1]").val();
if(pwd1==""){
alert("密码不能为空！");
return false;
}
判断两次输入的密码必须一致
if(pwd1!=pwd){
alert("两次输入的密码不一致！")
return false;
}
//邮箱中需要包含@和.
var mail=$("[name=em]").val();
if(mail==""){
alert("邮箱不能为空！");
return false;
}
if(mail.indexOf("@")==-1){
alert("Email格式不正确
必须包含@");
return false;
}
if(mail.indexOf(".")==-1){
alert("Email格式不正确
必须包含.");
return false;
}
});
当获取焦点时邮箱value值为空，失去焦点时value="请输入正确的电子邮箱"
var q=$("#but").val();
$("#but").focus(function(){
if(q=="请输入正确的电子邮箱"){
$(this).val("");
$(this).css("border","1px solid #ff0000");
}
}).blur(function(){
if(q==""){
$(this).val("请输入正确的电子邮箱");
}
});
});
</script>
</body>