-1

私は3つあり、それらはすべてパラメータを持つ<a>クラス(1から3まで)を持っています。.info-btndata="1"

<a>with クラスをクリックすると、varでパラメーター.info-btnを取得し、クラスで表示される div を作成する必要があります(* = 1,2 または 3; 各クラスが存在します)。data=*x$('.div-info-'+x).fadeToggle("fast");.div-info-*

そして、私が他に望んでいたこと：クリックが上のように別の場所にある場合、表示さ<a class=".info-btn"れるdivを非表示にする必要があります。

私が作成したものと使用可能なもの..

   $(".info-btn").click(function(e){ 
        var x = $(this).attr('data');
        $('.div-info-'+x).fadeToggle("fast");
    });`

ただし、クラスクリックのトグルのみであり、他の場所をクリックして非表示にすることはできません。

私が他のことのために試した私のコード..

$(document.body).click(function(e){

            if ((".info-btn").click())
            {
                var x = $(this).attr('data');
                $('.div-info-'+x).fadeToggle("fast");
            }
            else (!(".info-btn").click())
            {
                var x = $(this).attr('data');
                $('.div-info-'+x).fadeToggle("fast");
            }

        });

あなたの誰かが私を助けてくれることを願っています.私の悪い英語の人たちに申し訳ありません..

4

1 に答える 1

1

.data()どの要素がクリックされたかを保存するために使用できます。後でドキュメントをクリックして、ターゲットがdivその親でもなく（オプション）、それを非表示にするかどうかを確認します。

HTML

<a class="info-btn" data="1" href="#">INFO</a>

<div class="div-info-1">Sortierung der Kategorien wird automatisch drei mal täglich ausgeführt. Sortierung Ende Juni 2013 anpassen!</div>

JavaScript

$(".info-btn").click(function (e) {
    var x = $(this).attr('data');
    $('.div-info-' + x).show();
    $(".info-btn").data('clickedDivId', '.div-info-' + x);
    return false;
});

$(document).on('click', function (e) {
    console.log('document clicked');
    var target = e.target;
    var clickedDiv = $(".info-btn").data('clickedDivId');
    if (!$(target).is(clickedDiv) && !$(target).parents().is(clickedDiv)) {
        $(clickedDiv).hide();
    }
});

ワーキングデモ

于 2013-10-30T16:37:22.240 に答える