1

ユーザーが私のをクリック<input>すると、いくつかが表示されます<div>

次に、ユーザーはagianのような別の要素<body>または別のdivをクリックしたので、非表示にします

$("input").click(function(){
    $("div").fadeIn();
}).not(this).click(function(e){
    $("div").fadeOut();
});

遊び場: http: //jsfiddle.net/Zf34Q/

私のコードはfadeIn()fadeOut()同時に:(

4

3 に答える 3

6

jQUery

$("input").focus(function(){
    $("div").fadeIn();
}).blur(function(e){
    $("div").fadeOut();
});​

フィドル-http://jsfiddle.net/Zf34Q/1/

編集

ダウン有権者、申し訳ありませんが、質問を正しく読んでいませんでした。今すぐ回答を更新しました

于 2012-11-12T14:18:24.600 に答える
3

あなたはこれを行うことができます :

$("input").click(function(){
    $("div").fadeIn();
    return false;
});
$(document).click(function(){
    $("div").fadeOut();
});

デモンストレーション

最初のコールバックはfalseを返し、ドキュメントへのイベントの伝播を回避します(これにより、fadeOutが起動します)。ドキュメントから:

ハンドラーからfalseを返すことは、イベントオブジェクトで.preventDefault()と.stopPropagation()の両方を呼び出すことと同じです。

編集: OPの正確なケースでは、要素は入力であるため、atif089のソリューションとブラー関数を使用するのが最適です。私の答えが、少なくともイベントの伝播を処理する方法を明確にするのに役立つことを願っています。

于 2012-11-12T14:15:53.420 に答える
1

@ atif089の回答を補足するために、元のコードの何が問題だったのかを説明します。

セレクターを作成するthisときは、inputではなく、他のオブジェクト(おそらくwindow)です。ハンドラーを他の要素でトリガーするようにする場合は、clickハンドラーをページ上の他のすべての要素にバインドするか、共通の親要素でデリゲートイベントを使用する必要があります。

@ atif089の答えは、焦点の変更を利用することで、より実用的な解決策を持っています。


http://jsfiddle.net/Zf34Q/2/":not"を使用してそれを行う方法の例

于 2012-11-12T14:28:58.653 に答える