<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
使用说明：
1、消息显示对象id = 输入表单id + _msg
如用户名输入表单id=txt_username,消息显示对象id=txt_username_msg
2、错误消息:写在输入表单的title里，具体如下
<script>
//参数说明 ，o : 检查对象 ,sType : 数据类型
function CheckInput(o ,sType){
var msg=document.getElementById(o.id + '_msg')
//用户名
if(sType=='username'){
msg.innerHTML=(!/^[a-z0-9]{4,20}$/gi.test(o.value))? o.title : '√'
}
//密码
if(sType=='password'){
msg.innerHTML=(!/^[\S]{6,20}$/gi.test(o.value))? o.title : '√'
}
//更多数据类型验证方法可以自己添加....
}
</script>
</head>
<body>
用户名：<input type="text" name="txt_username" id="txt_username" onblur="CheckInput(this, 'username')" title="用户名不能为空
，应为4-20个字母数字组成！"/><span id="txt_username_msg"></span>
<br/>
密码：<input type="text" name="txt_password" id="txt_password" onblur="CheckInput(this, 'password')" title="密码不能为空，应
为6-20个非空字符组成！"/><span id="txt_password_msg"></span>
</body>
</html>
简单改了下你的，效果实现了，规范的写法自己改改吧
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8"/>
<title>checkValidity 示例</title>
<style>
input.dd::-webkit-input-placeholder{
color: red
opacity:1
}
</style>
</head>
<body>
<form action="" method="get">
<table width="200%" border="0" cellspacing="0" cellpadding="0" >
<tr>
<td><input class='' id='id' name="uname" type="text" placeholder="ID" onblur="aa(this)"></td>
</tr>
<tr>
<td><input name="pwd" type="password" placeholder="密码"></td>
</tr>
<tr>
<td><input name="" type="submit"></td>
</tr>
</table>
</form>
<script>
function aa(a){
if(a.value==''){
a.placeholder='ID不能为空'
a.className="dd"
}
}
</script>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）