首頁 > web前端 > js教程 > 主體

jquery中focusin與focusout的使用詳解

黄舟
發布: 2017-06-27 13:24:57
原創
1653 人瀏覽過

jquery 的focusin和focusout方法的使用

focusin(fn)

##概述

#在每一個符合元素的focusin

事件中綁定一個處理函數當一個元素,或者其內部任何一個元素獲得焦點的時候會觸發這個事件。這跟focus事件差別在於,他可以在父元素上偵測子元素取得焦點的情況。

參數
fnFunction在每個符合元素的focusin事件中所綁定的處理函數。
範例
描述:
取得焦點後會觸發
動畫:
HTML 程式碼:

<p><input type="text" /> <span>focusout fire</span></p>
<p><input type="password" /> <span>focusout fire</span></p>jQuery 代码:
$("p").focusin(function() {
  $(this).find("span").css(&#39;
display
&#39;,&#39;inline&#39;).fadeOut(1000);
});
登入後複製

focusout(fn)

概述
在每一個符合元素的focusout事件中綁定一個處理函數。

當一個元素,或是其內部任何一個元素失去焦點的時候會觸發這個事件。這跟blur事件差別在於,他可以在父元素上偵測子元素失去焦點的情況。

參數
fnFunction在每個符合元素的focusout事件中所綁定的處理函數。

範例
描述:
失去焦點後會​​觸發動畫:
HTML 程式碼:

<p><input type="text" /> <span>focusout fire</span></p>
<p><input type="password" /> <span>focusout fire</span></p>jQuery 代码:
$("p").focusout(function() {
  $(this).find("span").css(&#39;display&#39;,&#39;inline&#39;).fadeOut(1000);
});
登入後複製

##

以上是jquery中focusin與focusout的使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板