onblur和onfocus

onfocus获得焦点

onblur失去焦点

例子：

.red{
border:1px solid red;
}
span{display:none;}

 

姓名：<input type="text" id="inp" class="no"> <span id="tip">请输入您的姓名</span>

 

var hqsrk =document.getElementById('inp')
tip = document.getElementById("tip");

hqsrk.onfocus=function(){
tip.style.display="block";
tip.innerHTML="请输入您的姓名";
}
hqsrk.onblur=function(){
var abc = this.value;　　//用于获取文本框的值，value用于获取表单元素的值
if (abc.length==0) {
tip.innerHTML="用户名不能为空";   //更改span标签的内容
inp.className="red";   //更改样式名字  将no改成red
}else{
tip.style.display="none";
inp.className="no";
}
}