jQuery を使用して入力フォーカスを検出し、マウスアウト時の境界線の削除を防ぐにはどうすればよいですか?-jsチュートリアル-php.cn

jQuery を使用して入力フォーカスを検出し、マウスアウト時の境界線の削除を防ぐにはどうすればよいですか?

Susan Sarandon

リリース： 2024-11-29 02:50:10

オリジナル

394 人が閲覧しました

How Can I Use jQuery to Detect Input Focus and Prevent Border Removal on Mouse Out?

jQuery を使用して入力フォーカスを決定し、境界線の削除を防止する

ブラウザ間の互換性を実現するために、jQuery の .hover を使用します。 CSS の :hover on 非を模倣する () メソッド。 Internet Explorer 6 の要素により、予期しない問題が発生しました。これらの

のいずれか内の入力がフォーカスを取得すると、.hover() メソッドによって作成された境界線はマウスアウト時に消えます。

これを解決するために、入力がフォーカスされているかどうかを確認しようとします。マウスアウト。 jQuery には :focus セレクターがないため、代替メソッドが必要です。

jQuery 1.6 以降

jQuery 1.6 には :focus セレクターが含まれており、カスタム実装の必要がなくなります。 $("..").is(":focus") を使用して、フォーカスされた入力をチェックするだけです。

jQuery 1.5 以降

以前の jQuery バージョンの場合、カスタム :focus セレクターを定義することをお勧めします。これは次の方法で実現できます:

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

ログイン後にコピー

これにより、フォームコントロールとハイパーリンクのみがフォーカスされていると見なされます。

または、

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

ログイン後にコピー

または:

$("input:focus").doStuff();

ログイン後にコピー

すべての jQueryバージョン

jQuery のバージョンに関係なく、どの要素にフォーカスがあるかを判断するには、次を使用します。

$(document.activeElement)

ログイン後にコピー

欠落している :focus セレクターの確認

jQuery のバージョンが不明な場合は、:focus セレクターを追加できます手動:

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

ログイン後にコピー

これらの手法を採用すると、ブラウザ固有の制限に適応しながら、望ましい境界線の動作を維持できます。

以上がjQuery を使用して入力フォーカスを検出し、マウスアウト時の境界線の削除を防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。