以前我们在js中写input各种事件时都会直接在input中写，昨天开始我开始全面使用jquery了，现在来谈一下我对jquery blur() focus()事件的学习笔记。
对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。
focus()：得到焦点时使用，和javascript中的onfocus使用方法相同。
如：
| 代码如下 | 复制代码 |
|
$("p").focus(); 或$("p").focus(fn) |
|
blur()：失去焦点时使用，和onblur一样。
如：
| 代码如下 | 复制代码 |
|
$("p").blur(); 或$("p").blur(fn) |
|
例
| 代码如下 | 复制代码 |
|
<script type="text/javascript"> $(document).ready(function(){ $("input").focus(function(){ $("input").css("background-color","#FFFFCC"); }); $("input").blur(function(){ $("input").css("background-color","#D6D6FF"); }); }); </script> </head> <body> Enter your name: <input type="text" /> <p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p> </body> |
|
鼠标在搜索框中点击的时候里面的文字就消失了。
| 代码如下 | 复制代码 |
|
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>input失去焦点和获得焦点jquery焦点事件插件</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ //focusblur jQuery.focusblur = function(focusid) { var focusblurid = $(focusid); var defval = focusblurid.val(); focusblurid.focus(function(){ var thisval = $(this).val(); if(thisval==defval){ $(this).val(""); } }); focusblurid.blur(function(){ var thisval = $(this).val(); if(thisval==""){ $(this).val(defval); } }); }; /*下面是调用方法*/ $.focusblur("#searchkey"); }); </script> </head> <body> </body> |
|
一个根据ajax值来判断是显示或隐藏div
| 代码如下 | 复制代码 |
|
<tr> <td width=‘70‘ height=‘30‘ align=‘right‘><span class="red">*</span> 手机：</td> <td width=‘198‘ align=‘center‘><input name="tgmo" type="text" class="tcinp" id="tgmo" size="15"/></td> <td><span class="gray">用房乐网会员登录名可获取5房乐币 </span></td> </tr> js $(function(){ |
|
【声明】 本文链接地址为: http://www.php230.com/1412685601.html，转载请注明出处！