私が構築しているサイトのフロント ページでは、いくつかの が<div>CSS:hover疑似クラスを使用して、マウスが上にあるときに境界線を追加します。 の 1 つには<div>が含まれており<form>、jQuery を使用して、その中の入力にフォーカスがある場合に境界線が維持されます。これは、IE6 が:hover以外の要素で をサポートしていないことを除いては完璧に機能します<a>。そのため、このブラウザーでのみ、メソッド:hoverを使用してCSS を模倣するために jQuery を使用しています$(#element).hover()。唯一の問題は、jQuery がフォームfocus() と の hover()両方を処理するようになったため、入力にフォーカスがあり、ユーザーがマウスを内側または外側に動かすと、境界線が消えてしまうことです。
この動作を止めるには、何らかの条件文を使用できるのではないかと思いました。たとえば、マウス アウト時に入力のいずれかにフォーカスがあるかどうかをテストすると、境界線が消えないようにすることができます。私の知る限り、:focusjQuery にはセレクターがないので、これを実現する方法がわかりません。何かアイデアはありますか?
ベストアンサー1
jQuery 1.6 以上
jQueryが追加:focusセレクターを追加する必要はありません。$("..").is(":focus")
jQuery 1.5 以下
編集：時代が変わるにつれて、私たちはフォーカスをテストするためのより良い方法を見つけます。新しいお気に入りはベン・アルマンのこの要点:
jQuery.expr[':'].focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
マティアス・ビネンスより引用ここ:
本文のような誤検知を除外するためにテストが追加されたことに注意してください
(elem.type || elem.href)。この方法では、フォーム コントロールとハイパーリンクを除くすべての要素が除外されます。
新しいセレクタを定義しています。プラグイン/オーサリング. 次に、次の操作を実行します。
if ($("...").is(":focus")) {
...
}
または：
$("input:focus").doStuff();
任意のjQuery
どの要素にフォーカスが当たっているか知りたいだけなら、
$(document.activeElement)
バージョンが 1.6 以下になるかどうかわからない場合は、:focusセレクターがない場合は追加できます。
(function ( $ ) {
var filters = $.expr[":"];
if ( !filters.focus ) {
filters.focus = function( elem ) {
return elem === document.activeElement && ( elem.type || elem.href );
};
}
})( jQuery );