码迷,mamicode.com
首页 > Web开发 > 详细

JS之用户注册高亮显示

时间:2017-12-18 19:18:13      阅读:247      评论:0      收藏:0      [点我收藏+]

标签:post   知识   innerhtml   注册   否则   pos   文本   doc   .class   

当用户注册的时候,符合要求的显示绿色框,不符合要求的显示红色框,并且下方有文本提示

知识点:onblur  当文本框失去焦点,会触发事件

<body>
账号:<input type="text" name="yonghu" onblur="fn1(this)" /><br>
<p></p>
<br>

密码:<input type="password" name="mima" onblur="fn2(this)" />
<br>
<p></p>
<script>
//需求:失去焦点的时候判断input文本框中的值,如果账号或密码在6-12个字符之间通过,否则报错
//获取事件源和相关元素
//绑定事件
//书写驱动程序
var pp=document.getElementsByTagName("p")[0];
var pp1=document.getElementsByTagName("p")[1];
function fn1(aaa){
if(aaa.value.length<6||aaa.value.length>12){
    aaa.className="wrong";
        pp.innerHTML="<p>请输入6-11位数字或字母</p>";
    
}else{
    aaa.className="right";
    pp.innerHTML="<p></p>";

}
}
function fn2(aaa){
    if (aaa.value.length<6||aaa.value.length>12) {
        aaa.className = "wrong";
        pp1.innerHTML="<p>请输入6-11位密码</p>";

    }else{
        aaa.className = "right";
        pp1.innerHTML="<p></p>";
    }
}
</script>
</body>

 

JS之用户注册高亮显示

标签:post   知识   innerhtml   注册   否则   pos   文本   doc   .class   

原文地址:http://www.cnblogs.com/creazybeauty/p/8058045.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有 京ICP备13008772号-2
迷上了代码!