Detailed explanation of the use of focusin and focusout in jquery

jquery Use of focusin and focusout methods

focusin(fn)

Overview

Bind a processing function to the focusin event of each matching element.
This event is triggered when an element, or any element within it, gains focus. The difference between this and the focus event is that it can detect whether the child element has gained focus on the parent element.

Parameters
fnFunction is the processing function bound in the focusin event of each matching element.
Example
Description:
Will trigger after getting focusAnimation:

HTML code:

<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)
Overview
Bind a handler function to the focusout event of each matching element.

This event is triggered when an element, or any element within it, loses focus. The difference between this and the blur event is that it can detect when the child element loses focus on the parent element.

Parameters
fnFunction is the processing function bound in the focusout event of each matching element.

Example
Description:
Animation will be triggered after losing focus:
HTML code:

<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);
});

The above is the detailed content of Detailed explanation of the use of focusin and focusout in jquery. For more information, please follow other related articles on the PHP Chinese website!