1

ページ上の別の要素を非表示にしたいonFocusの2つのフォーム入力があります。

$(document).ready(function () { 
        $('.email').focus(function () {
            $('.note').fadeTo('fast', 0);
        }).blur(function () {
            $('.note').fadeTo('fast', 1);
        });
        $('.password').focus(function () {
            $('.note').fadeTo('fast', 0);
        }).blur(function () {
            $('.note').fadeTo('fast', 1);
        });
    });

かなり基本的なことですが、これら 2 つの入力 (.email と .password) を切り替えるときに、非表示の要素が再び表示されないようにする必要もあります。

それらを切り替えると、非表示の要素がちらついて表示に戻ったり、何らかの理由で要素がフォーカスされていないために .focus イベントが発生していないように見えることがあります。

.email と .password の間の切り替えが、これらの要素の両方からフォーカスが失われるまで非表示のままである場合、.note 要素は非表示になっていると私が言うことはありますか?

4

2 に答える 2

0

jsFiddleでいくつか試してみたところ、次の解決策が見つかりました。blur()が の前に実行されているように見えるfocus()ため、フェードインしてすぐにフェードアウトします。

短時間でぼかしイベントを遅らせるタイムアウトを設定したので、ぼかしを実行する前に、新しい要素がフォーカスされているかどうかを確認できます。

$( document ).ready( function( ) {
    $( '.email, .password' ).focus( function( ) {
        $( '.note' ).fadeTo( 'fast', 0 );
    } ).blur( function( ) {
        setTimeout( function( ) {
            if( $( '.email:focus, .password:focus' ).length == 0 )
            {
              $( '.note' ).fadeTo( 'fast', 1 );
            }
        }, 100 );
    } );
} );​
于 2012-06-08T16:54:17.907 に答える
0

を使用し:focusて、他のフィールドが現在フォーカスされているかどうかを確認できます。

$(document).ready(function () { 
        $('.email').focus(function () {
            $('.note').fadeTo('fast', 0);
        }).blur(function () {
            if ($('.password:focus').length == 0)
                $('.note').fadeTo('fast', 1);
        });
        $('.password').focus(function () {
            $('.note').fadeTo('fast', 0);
        }).blur(function () {
            if ($('.email:focus').length == 0)
                $('.note').fadeTo('fast', 1);
        });
    });
于 2012-06-08T12:49:39.210 に答える