jQuery で入力要素がフォーカスされているかどうかを確認するにはどうすればよいですか?

jQuery を使用して入力がフォーカスされているかどうかを確認する方法

Web サイトのフロント ページでは、複数の

要素は CSS :hover 疑似クラスを使用して、マウスを要素の上に置いたときに境界線を表示します。これらのいずれか

要素には

が含まれています。これは、jQuery の助けを借りて、入力要素のいずれかにフォーカスがあるときに境界線を維持します。

このセットアップは、IE6 を除いて問題なく機能します。IE6 は、 以外の要素で :hover をサポートしません。タグ。この問題に対処するために、jQuery を利用して $(#element).hover() メソッドを使用して CSS :hover を模倣します。

ただし、jQuery がフォームの focus() と hover() の両方を処理するときに問題が発生します。 。入力要素がフォーカスを取得し、ユーザーがマウスを前後に動かすと、境界線が消えます。

この動作を解決するには、条件ステートメントの使用を検討してください。たとえば、マウス アウト イベントにフォーカスがある入力があるかどうかを確認することで、境界線が消えるのを防ぐことができます。 jQuery には :focus セレクターがないため、代替アプローチを検討する必要があります。

jQuery 1.6

jQuery 1.6 では :focus セレクターが導入され、カスタム実装の必要性がなくなりました。単純に使用します:

$("..").is(":focus")

jQuery 1.5 以前

Ben Alman の実装を含む、フォーカスをテストするための新しいメソッドが登場しました:

jQuery.expr[':'].focus = function( elem ) {
  return elem === document.activeElement && ( elem.type || elem.href );
};

これによりカスタム セレクターが定義され、使用が可能になります。例:

if ($("...").is(":focus")) {
  ...
}

任意の jQuery バージョン

現在フォーカスされている要素を取得する場合:

$(document.activeElement)

両方の jQuery バージョン 1.6 との互換性を確保するには以下:

(function ( $ ) {
    var filters = $.expr[":"];
    if ( !filters.focus ) { 
        filters.focus = function( elem ) {
           return elem === document.activeElement && ( elem.type || elem.href );
        };
    }
})( jQuery );

以上がjQuery で入力要素がフォーカスされているかどうかを確認するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。