1.封装的使用
2.innerHtml获取不到input的值,应为没有文本节点
3.获得光标事件.onfocus
4.test()正则表达式的专用方法
var ZH = document.querySelector(".yy .enter .enter-center .ZH input"); var MM = document.querySelector(".yy .enter .enter-center .MM input"); var DLbtn = document.querySelector(".enter-center .DLbtn"); //封装 由于需要多次获得多次文本框的值,所以定义函数$用于简化获得页面元素对象 function $(elementId){ return document.getElementById(elementId); }
DLbtn.onclick =function(){ checkUser(); checkPwd(); } /*用户名验证*/ function checkUser(){ console.log("aa"); var ZHValue = ZH.value; //ZH.innerHTML = "";//innerHtml获取不到input的值
console.log(ZHValue); //用户名是由英文字母和数字组成的4~16位字符,以字母开头 var reg = /^[a-zA-Z][a-zA-Z0-9]{3,15}$/; //console.log(reg.test(ZHValue)); //test()方法是使用 if(!reg.test(ZHValue)){ //console.log("bbb"); ZH.style.color = "red"; ZH.value = "用户名不正确,重新输入"; console.log(ZH.value); //console.log(ZH.innerHTML); return false; } return true; } /*密码验证*/ function checkPwd(){ var pwd = MM.value; //密码油4-10个字符组成 var reg = /^[0-9a-zA-Z]{4,10}$/ if(reg.test(pwd) == false){ MM.style.color = "red"; MM.value = "密码不正确,重新输入"; return false; } return true; } //在获得光标的时候去除显示错误的内容"密码不正确,重新输入",在设置回原来的字体颜色 ZH.onfocus = function(){ this.value = ""; this.style.color = "#000000"; } MM.onfocus = function(){ this.value = ""; this.style.color = "#000000"; }
|