-1

我有 3 个<a>都有.info-btn带data="1"参数的类（从 1 到 3）。

如果您单击<a>带有类的.info-btn它应该data=*在 var 中获取参数，x并且应该使用$('.div-info-'+x).fadeToggle("fast");该类创建一个可见的 div .div-info-*（* = 1,2 或 3；每个类都存在）

我还想要什么：如果点击是在其他地方，<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 回答