javascript版:
function getLength(str){ //检测输入字符的字符串长度
return str.replace(/[^\x00-xff]/g,"xx").length;//
}
function findStr(str,n){ //比较字符是否相同
var num = 0;
for(var i=0;i
if(str.charAt(i)==n)
{
num++;
}
}
return num;
}
window.onload = function(){
var aInput = document.getElementsByTagName ("input");//取出所有表单里所有输入框
var oName = aInput[0];//用户名
var pwd = aInput[1];//密码
var pwd2 = aInput[2];//确认密码
var aP = document.getElementsByTagName ("p");//取出输入框后面的文字反馈
var name_msg = aP[0];
var pwd_msg = aP[1];
var pwd2_msg = aP[2];
var count = document.getElement ById ("count");//统计用户名输入的字符个数
var aEm = document.getElementsByTagName ("em");//验证密码输入的强度
var name_length = 0;
//测试
//1.数字、字母(不区分大小写)、汉字、下划线
//2.5-25个字符,推荐使用中文名(\u4e00-\u9fa5)
//var re = /[\w\u4e00-\u9fa5]/g;//匹配英文字母、数字、下划线和汉字
oName.onfocus = function(){ //用户名输入框获得焦点
name_msg.style.display = "block";
name_msg.innerHTML = "5-25个字符,推荐使用中文名。";
}
oName.onkeyup = function(){ //键盘松开
count.style.visibility = "visible";//字符统计元素显示
name_length = getLength(this.value);
count.innerHTML = name_length+"个字符"; `
if(name_length == 0)
{
count.style.visibility = "hidden";
}
}
oName.onblur = function(){ //用户名输入框失去焦点
//含有非法字符,不能为空,长度超过25个字符,长度少于6个字符
var re = /[^\w\u4e00-\u9fa5]/g; //匹配所有非英文字母、数字、下划线和汉字
if(re.test(this.value))
{
name_msg.innerHTML = "含有非法字符";
}
else if(this.value == "")
{
name_msg.innerHTML = "不能为空";
}
else if(name_length>25)
{
name_msg.innerHTML = "长度超过25个字符";
}
else if(name_length<6)
{
name_msg.innerHTML = "长度少于6个字符";
}
else
{
name_msg.innerHTML = "OK";
}
}
pwd.onfocus = function(){
pwd_msg.style.display = "block";
pwd_msg.innerHTML = "6-16个字符,请使用字母加数字或符号的组合密码,不能单独使用字母、数字或符号。";
}
pwd.onkeyup = function(){
//大于5个字符 “中”
if(this.value.length>5)
{
aEm[1].className = "active";
pwd2.removeAttribute("disabled");
pwd2_msg.style.display = "block";
}
else
{
aEm[1].className = "";
pwd2.setAttribute("disabled");
pwd2_msg.style.display = "none";
}
//大于10个字符 “强”
if(this.value.length>10)
{
aEm[2].className = "active";
}
else
{
aEm[2].className = "";
}
}
pwd.onblur = function(){
var m = findStr(pwd.value,pwd.value[0]);
var re_n = /[^\d]/g; //匹配所有非数字字符
var re_t = /[^a-zA-Z]/g; //匹配所有非英文字母字符
if(this.value == "")
{
pwd_msg.innerHTML = "不能为空";
}
else if(m == this.value.length)
{
pwd_msg.innerHTML = "不能用相同字符";
}
else if(this.value.length<6||this.value.length>16)
{
pwd_msg.innerHTML = "长度应为6到16个字符";
}
else if(!re_n.test(this.value))
{
pwd_msg.innerHTML = "不能全为数字";
}
else if(!re_t.test(this.value))
{
pwd_msg.innerHTML = "不能全为字母";
}
else
{
pwd_msg.innerHTML = "OK";
}
}
pwd2.onblur = function(){
if(this.value != pwd.value)
{
pwd2_msg.innerHTML = "两次输入的密码不一致!";
}
else
{
pwd2_msg.innerHTML = "OK";
}
}
}
jQuery版:
$(function(){
$("#name").blur(function(){//用户名文本框失去焦点触发验证事件
if($(this).val() && $(this).val().match("^[a-zA-Z0-9]"))//验证用户名不能为空并且只能为"[A-Z][a-z][0-9]"组成
{
$("#nameTip").html("");
}
else
{
$("#nameTip").html("用户名不能为空且只能为英文或者数字");
}
});
$("#email").blur(function(){ //邮箱文本框失去焦点时触发验证事件
if($(this).val() && $(this).val().match("/^[a-z]([a-z0-9]*[-_]?[a-z0-9]+)*@([a-z0-9]*[-_]?[a-z0-9]+)+[\.][a-z]{2,3}([\.][a-z]{2})?$"))//验证邮箱不能为空并且格式要求正确
{
$("#emailTip").html("");
}
else
{
$("#emailTip").html("邮箱不能为空且必须格式正确");
}
});
$("#pas1").blur(function(){//密码文本框失去焦点触发验证事件
if($(this).val() && $(this).val().match("^[a-zA-Z0-9]"))//验证密码不能为空并且只能为"[A-Z][a-z][0-9]"组成
{
$("#pas1Tip").html("");
}
else
{
$("#pas1Tip").html("密码不能为空且只能为英文或者数字");
}
});
$("#pas2").blur(function(){//确认密码文本框失去焦点触发验证事件
if($(this).val() && $(this).val().match("^[a-zA-Z0-9]") &&$(this).val() == $("#pas1").val())//验证密码不能为空或者两次密码输入是否一致
{
$("#pas2Tip").html("");
}
else
{
$("#pas2Tip").html("密码为空或者两次密码输入不一致");
}
});
})