您的位置:首页 > 其它

注册页面,各种验证和省市联动

2016-05-24 09:54 288 查看
/**
* Created by Administrator on 2016/5/23.
*/
$(document).ready(function(){
//提交验证
$("#registerBtn").click(function(){
$("form").submit(function(){
//邮箱验证
var email=$(this).val();
var reg=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; //正则表达式邮箱地址判断
if(reg.test(email)){
$("#email_prompt").addClass("register_prompt_ok");
}else{
$("#email_prompt").addClass("register_prompt_error");
$("#email_prompt").html("你输入的邮箱地址不正确,请重新输入!");
$("#email").addClass("register_input_Blur");
return false;
}

//昵称验证
var nickName=$(this).val();
var reg=/^\w{4,10}$/; //正则表达式4~10位
if(reg.test(nickName)){
$("#nickName_prompt").addClass("register_prompt_ok");
}else{
$("#nickName_prompt").addClass("register_prompt_error");
$("#nickName_prompt").html("用户名4~10位");
$("#nickName").addClass("register_input_Blur");
return false;
}

//密码验证
//移出状态开始验证
var pwd=$(this).val();
var reg=/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,16}$/; //正则表达式6~16位密码
if(reg.test(pwd)){
$("#pwd_prompt").addClass("register_prompt_ok");
}else{
$("#pwd_prompt").addClass("register_prompt_error");
$("#pwd_prompt").html("必须包含大小写字母和数字的组合,不能使用特殊字符,长度在6-16之间");
$("#pwd").addClass("register_input_Blur");
return false;
}

//密码确认验证
var repwd=$(this).val();
var reg=$("#pwd").val(); //上一次输入的密码
if(reg==repwd){
$("#repwd_prompt").addClass("register_prompt_ok");
}else{
$("#repwd_prompt").addClass("register_prompt_error");
$("#repwd_prompt").html("两次输入密码不相同");
$("#repwd").addClass("register_input_Blur");
return false;
}
alert("提交成功");
return true;
});
});

//输入状态加样式
$(".register_input").focus(function(){
$(this).addClass("register_input_Focus");
});
//移出状态移除样式
$(".register_input").blur(function(){
$(this).removeClass("register_input_Focus");
});

//邮箱验证
//关注时移除验证后状态
$("#email").focus(function(){
$("#email_prompt").removeClass("register_prompt_ok");
$("#email_prompt").removeClass("register_prompt_error");
$("#email_prompt").html("");
$("#email").removeClass("register_input_Blur");
});
//移出状态开始验证
$("#email").blur(function(){
var email=$(this).val();
var reg=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; //正则表达式邮箱地址判断
if(reg.test(email)){
$("#email_prompt").addClass("register_prompt_ok");
}else{
$("#email_prompt").addClass("register_prompt_error");
$("#email_prompt").html("你输入的邮箱地址不正确,请重新输入!");
$("#email").addClass("register_input_Blur");
}
});

//昵称验证
//关注时移除验证后状态
$("#nickName").focus(function(){
$("#nickName_prompt").removeClass("register_prompt_ok");
$("#nickName_prompt").removeClass("register_prompt_error");
$("#nickName_prompt").html("");
$("#nickName").removeClass("register_input_Blur");
});
//移出状态开始验证
$("#nickName").blur(function(){
var nickName=$(this).val();
var reg=/^\w{4,10}$/; //正则表达式4~10位
if(reg.test(nickName)){
$("#nickName_prompt").addClass("register_prompt_ok");
}else{
$("#nickName_prompt").addClass("register_prompt_error");
$("#nickName_prompt").html("用户名4~10位");
$("#nickName").addClass("register_input_Blur");
}
});

//密码验证
//关注时移除验证后状态
$("#pwd").focus(function(){
$("#pwd_prompt").removeClass("register_prompt_ok");
$("#pwd_prompt").removeClass("register_prompt_error");
$("#pwd_prompt").html("");
$("#pwd").removeClass("register_input_Blur");
});
//移出状态开始验证
$("#pwd").blur(function(){
var pwd=$(this).val();
var reg=/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,16}$/; //正则表达式6~16位密码
if(reg.test(pwd)){
$("#pwd_prompt").addClass("register_prompt_ok");
}else{
$("#pwd_prompt").addClass("register_prompt_error");
$("#pwd_prompt").html("必须包含大小写字母和数字的组合,不能使用特殊字符,长度在6-16之间");
$("#pwd").addClass("register_input_Blur");
}
});

//密码确认验证
//关注时移除验证后状态
$("#repwd").focus(function(){
$("#repwd_prompt").removeClass("register_prompt_ok");
$("#repwd_prompt").removeClass("register_prompt_error");
$("#repwd_prompt").html("");
$("#repwd").removeClass("register_input_Blur");
});
//移出状态开始验证
$("#repwd").blur(function(){
var repwd=$(this).val();
var reg=$("#pwd").val(); //上一次输入的密码
if(reg==repwd){
$("#repwd_prompt").addClass("register_prompt_ok");
}else{
$("#repwd_prompt").addClass("register_prompt_error");
$("#repwd_prompt").html("两次输入密码不相同");
$("#repwd").addClass("register_input_Blur");
}
});

//插入省市列表
var arr=new Array();
arr["广东省"]=["东莞市","广州市","中山市","深圳市","惠州市","江门市","珠海市","汕头市","佛山市","湛江市","河源市","肇庆市","清远市","潮州市","韶关市","揭阳市","阳江市","梅州市","云浮市","茂名市","汕尾市"];
arr["广西省"]=["贵港市","玉林市","北海市","南宁市","柳州市","桂林市","梧州市","钦州市","来宾市","河池市","百色市","贺州市","崇左市","防城港市"];
arr["安徽省"]=["芜湖市","合肥市","六安市","宿州市","阜阳市","安庆市","马鞍山市","蚌埠市","淮北市","淮南市","宣城市","黄山市","铜陵市","亳州市","池州市","巢湖市"," 滁州市"];
arr["北京市"]=["朝阳区","海淀区","通州区","房山区","丰台区","昌平区","大兴区","顺义区","西城区","延庆县","石景山区","宣武区","怀柔区","崇文区","密云县","东城区","平谷区","门头沟区"];

//插入省
for(var i in arr) {
$("#province").append("<option>"+i+"</option>");
}

//当省发生改变时插入市
$("#province").change(function(){
var v=$("#province").val();
$("#city").html("");//清空市列表
for(var i in arr[v]) {
$("#city").append("<option>" + arr[v][i] + "</option>");
}
});

//清空请选择文本
$("#province").focus(function(){
var v=$("#province").val();
if(v=="请选择省/城市"){
$("#province").children().eq(0).remove();
}
});

});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: