聚焦(onfocus)和失焦(onblur)用法笔记

08520170930

--注册表单--
<script >
window.onload = function(){
//  密码验证
    pasword.onblur = function(){
        if(pasword.value.length<6){
            hintpasword.innerHTML = "密码长度至少6位";
        }else{
            hintpasword.innerHTML = "验证通过！";    
        }
    };
    pasword.onfocus = function(){
        hintpasword.innerHTML = "注意密码位数和复杂度";
    };
//  重复密码验证
    repasword.onblur = function(){
        if(repasword.value!=pasword.value||repasword.value.length<6){
            hintrepasword.innerHTML = "两次输入的密码不一致"; 
        }else{
            hintrepasword.innerHTML = "验证通过！";
        }
    };
    repasword.onfocus = function(){
        hintrepasword.innerHTML = "注意密码要与第一次一致";
    };
//  邮箱验证
    email.onblur = function(){
        var pattern = /^([A-Za-z0-9]){1}([A-Za-z0-9_-])+@([a-z0-9])+\.{1}((com)|(cn)|(net))$/g;
        if(pattern.test(email.value)){
            hintemail.innerHTML = "验证通过！";
        }else{
            hintemail.innerHTML = "邮箱格式不正确！";   
        }
    };
    email.onfocus = function(){
        hintemail.innerHTML = "注意邮箱格式";
    };
//  var pattern = /^([A-Za-z0-9]){1}([A-Za-z0-9_-])+@([a-z0-9])+\.{1}((com)|(cn)|(net))$/g;
//  var str = "[email protected]";
//  console.log(pattern.test(str));
};
</script>



   
     

    密码：
    
     
     

    确认密码：
    
     
     
 
    电子邮箱:
    
     
     

    昵称：