Disclaimer: This article is a blogger original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.
<script type="text/javascript">
var reg=[/^[A-Z{1}\w{5,19}$/,/^[A-Z]{1}.{7,14}$/,/^[A-Z]{1}.{7,14}$/,
/^1[3-9]{1}\d{9}$/,/^ [\u4e00-\u9fa5][0-9A-z\u4e00-\u9fa5]+$/]
$(function(){
$(":text,:password").after("<span></span>");
$(":text,:password").blur(function(){
var value=$(this).val();
var index =$(this).attr("data-index");
var regTest=reg[index];
if(regTest.test(value)){
$(this).next("span").text("ok").css("color","green");
}else{
$(this).next("span").text("error").css("color","red");
}
});
});
</script>
<table>
<tr>
<th>用户名:</th>
<td><input type="text" id="userName" data-index="0" placeholder="请输入以大写字母开头6-20位(数字、字母、下划线)"/></td>
</tr>
<tr>
<th>密码:</th>
<td><input type="text" id="pwd" data-index="1" placeholder="请输入以大写字母开头数字字母混合8-15位"/></td>
</tr>
<tr>
<th>确认密码:</th>
<td><input type="text" id="pwdCode" data-index="2" placeholder="请输入以大写字母开头数字字母混合8-15位"/></td>
</tr>
<tr>
<th>手机号:</th>
<td><input type="text" id="phone" data-index="3" placeholder="请输入正确的手机号"/></td>
</tr>
<tr>
<th>地址:</th>
<td><input type="text" id="address" data-index="4" placeholder="中文开头 数字、字母、中文 混合"/></td>
</tr>
</table>