文本框失去焦点事件、获得焦点事件:
1、onBlur:当失去输入焦点后产生该事件 
2、onFocus:当输入获得焦点后,产生该文件 
3、Onchange:当文字值改变时,产生该事件 
4、Onselect:当文字加亮后,产生该文件 
5、onpropertychange 当属性改变发生该事件 
无论粘贴 keyup onchange等,最为敏感
将js代码直接写在input上:
 
 
jquery实现方法
对于元素焦点事件,我们可以使用jQuery的焦点函数focus(),blur()。
focus():得到焦点时使用,和javascript中的onfocus使用方法相同。
例子:
 
例子:
 
$("p").blur(); 或$("p").blur(fn)
<form>
<label for="searchKey" id="lbSearch">搜神马?</label>  这里label覆盖在文本框上,可以更好的控制样式
<input id="searchKey" type="text" />
<input type="submit" value="搜索" />
 </form>
 
jquery代码:
 
例子:
 
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>文本框获得焦点与失去焦点_www.jb200.com</title> 
</head> 
<script> 
function tt(){ 
var i=document.form1.text1.value;
if(i.length>=6) 
document.getElementById("s1").innerHTML="用户名不能大于6位"; 
else 
document.getElementById("s1").innerHTML=""; 
} 
function a(){ 
var j=document.form1.text2.value; 
if(j.length>=6) 
document.getElementById("s2").innerHTML="密码不能大于6位" 
else 
document.getElementById("s2").innerHTML=""; 
} 
</script> 
<body> 
<form name="form1"> 
用户名:<input type="text" id="text1" value="请输入用户名" onfocus="javascript:document.form1.text1.value=''" onblur="tt()"/> 
<span id="s1"></span><br /> 
密码:<input type="text" id="text2" value="请输入密码" onfocus="javascript:document.form1.text2.value=''" onblur="a()"/> 
<span id="s2"></span><br /> 
<input type="button" id="button" value="登陆" /> 
</form> 
</body> 
</html>
第一种:html5
html5给表单文本框新增加了几个属性,比如:email,tel,number,time,required,autofocus,placeholder等等,这些属性给表单效果带来了极大的效果变化。 
其中placeholder就是其中一个,它可以同时完成文本框获得焦点和失去焦点。必须保证input的value值为空, placeholder的内容就是我们在页面上看到的内容。 
例子: 
<input type="text" value="" placeholder="请输入内容" />
第二种:jQuery
原理:让表单的val值等于其title值。 
 
文本框获得焦点、失去焦点调用js脚本: