0

次のコードを使用して、「外側をクリック」して作業を終了しました。

div をクリックすると、次のように表示されます。

$('div.topIconNew').click(
    function(){
        $(this).siblings('div.topTip').show();
        $(this).siblings('div.topDrop').slideDown(240);

div 非表示の外側をクリックすると: 

$('div#wrapper').click(
    function(event){
        $('div.topIconNew, div.topTip, div.topDrop').hide();
    }
);
$('div.topTip, div.topDrop').click(
    function(event){
        event.stopPropagation();
    }
);

上記の問題は、topIconNew .stopPropagation によって、topTip と topDrop の div が開かれると、同じ topIconNew をもう一度 (トグル) または topIconNew の別のインスタンスをクリックしても閉じないことです。

新しい編集***

さて、私はこれについて考えていて、解決策が if ステートメントである可能性があるかどうか疑問に思っています。

したがって、最終的には次の追加コードが必要です。

$('topIconNew').click(
    function(){
        $('div.topTip, div.topDrop').hide();
    }
);

ただし、 topTip と topDrop が開いていて、現在開いている topTip 要素と topDiv 要素のみを非表示にする場合にのみ、topIconNew をクリックすると topTip と topDrop を非表示にすることも上記に示してください。

上記のことをどのように言えばよいでしょうか？

4

1 に答える 1

1

これはあなたの質問に直接答えるものではありませんが、SOの誰かが「ポップアップを閉じるにはどこかをクリックする」方法をかなりエレガントな方法で実装しているのを見ました。注意点は、ページの残りの部分ではe.stopPropagation()控えめに使用する必要があるということです。

$('div.topIconNew').click(function(e){
    $(this).siblings('div.topTip').show();
    $(this).siblings('div.topDrop').slideDown(240); 

    $(document).one('click', function() {
        $('div.topTip, div.topDrop').hide();
    });

    e.stopPropagation();        

    ...
});
于 2011-12-14T08:02:16.140 に答える