input失去焦点和获得焦点jquery焦点事件
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 <title>input失去焦点和获得焦点jquery焦点事件插件 - 懒人建站</title> 5 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 6 <script type="text/javascript"> 7 $(document).ready(function(){ 8 //focusblur 9 jQuery.focusblur = function(focusid) { 10 var focusblurid = $(focusid); 11 var defval = focusblurid.val(); 12 focusblurid.focus(function(){ 13 var thisval = $(this).val(); 14 if(thisval==defval){ 15 $(this).val(""); 16 } 17 }); 18 focusblurid.blur(function(){ 19 var thisval = $(this).val(); 20 if(thisval==""){ 21 $(this).val(defval); 22 } 23 }); 24 25 }; 26 /*下面是调用方法*/ 27 $.focusblur("#searchkey"); 28 }); 29 </script> 30 </head> 31 32 <body> 33 <form action="" method="post"> 34 <input name="" type="text" value="输入搜索关键词" id="searchkey"/> 35 <input name="" type="submit" id="searchbtn" value="搜索"/> 36 </form> 37 <p>input失去焦点和获得焦点jquery焦点事件插件,<br/><strong style="color:#F00">鼠标在搜索框中点击的时候里面的文字就消失了</strong>。</p> 38 39 </body> 40 </html>
文章来自懒人建站:http://www.51xuediannao.com/js/jquery/jquery_focusblur.html