密码正确,文字变绿,错误变红
<form action="#" name="formName" method="GET">
<label> 用户名</label><input type="text" name="UserName" id="id_UserName"/><label>用户名的长度位6-8为,由字母数字下划线组成</label> <br />
<label> 密码</label><input type="password" name="UserPwd" id="id_UserPwd"/><label>密码的长度位6-8为,由数字组成</label> <br />
<button type="button" name="tj" id="id_tj" onclick="checkform()"> 提交 </button>
</form>
<script type="text/javascript">
function checkform(){
var _UserNameValue=document.getElementById('id_UserName').value;
var _UserPwdValue=document.getElementById('id_UserPwd').value;
var reg=/[a-zA-Z0-9_]{6,8}$/;
var jieguo=_UserNameValue.search(reg);
if( jieguo == 0){
alert("用户名输入正确")
}else{
alert("用户名输入错误")
}
var pwdReg=/[0-9]{6,8}$/;
var jieguo2=pwdReg.test(_UserPwdValue);
if(jieguo2){
alert("密码输入正确")
}else{
alert("密码输入错误")
}
}
</script>
</body>
document.getElementById('id_UserName').nextElementSibling.style.color = 'red';
document.getElementById('id_UserName').nextElementSibling.style.color = 'blue';