注意:需要引入外部jquery文件,比如Jquery1.5.2.js。
1、js代码部分
<script type="text/javascript">
/**
* Jquery验证用户名、密码
*/
$(function(){
$("#name").blur(function(){//用户名文本框失去焦点触发验证事件
if(!$(this).val || !$(this).val.match(/([w]){2,15}$/))//只处验证不能为空并且只能为英文或者数字或者下划线组成的2-15个字符
{
$("#nameTip").html("用户名不能为空且只能为英文或者数字");
}
else
{
$("#nameTip").html("输入正确");
}
});
$("#pas1").blur(function(){//用户名文本框失去焦点触发验证事件
if(!$(this).val || !$(this).val.match(/([w]){2,15}$/))//只处验证和上面一样
{
$("#pas1").html("密码不能为空且只能为英文或者数字");
}
else
{
$("#pas1").html("输入正确");
}
});
$("#pas2").blur(function(){//用户名文本框失去焦点触发验证事件
if(!$(this).val || $(this).val() != $("#pas1").val() )//只处验证和上面一样
{
$("#pas2").html("密码为空或者和上面的密码不致");
}
else
{
$("#pas2").html("输入正确");
}
});
})
</script>
2、页面内容部分