Question

我的jQuery代码有问题，我希望页面能够滑动一个div，另一个被点击，问题是我不想一次又一次地编写所有代码所以我试着创建一个代码这一直都有效，但我被困住了。 Box是应该被点击的div，它应该包含一个类，它也用于要滑动的div。它应该从选项卡中拉出类，然后使用它来滑动切换正确的对象。请帮助：S（元素不会彼此靠近，这使得下一个或儿童不可能）。如果您有任何问题 - 请问！

我的jQuery代码：

$(".box").click(function() {
   var Klassen = $(this).attr("class");
   $("Klassen").slideToggle(300);
});

HTML：

<!-- These should be clicked -->
       <div data-toggle-target="open1" class="box ft col-lg-3">
            <div class="mer">
                Läs mer
            </div>

            <div class="bild"><img src="images/sakerhet.jpg"></div>

            <h4>HöstlovsLAN</h4>
        </div>
        </a>
        <div data-toggle-target="open2" class="box st col-lg-3">
            <div class="mer">
                Läs mer
            </div>

            <div class="bild"><img src="images/sakerhet.jpg"></div>

            <h4>NyårsLAN</h4>
        </div>
        <div data-toggle-target="open3" class="box tt col-lg-3">
            <div class="mer">
                Läs mer
            </div>

            <div class="bild"><img src="images/sakerhet.jpg"></div>

            <h4>Säkerhet</h4>
        </div>
<!-- These should be toggled -->
        <div class="infobox" id="open1">
        <h1>HöstlovsLAN</h1>
        </div>
        <div class="infobox" id="open2">
        <h1>NyårsLAN</h1>
        </div>
        <div class="infobox" id="open3">
        <h1>Säkerhet</h1>
        </div>

编辑 - 新问题 - 仍然没有工作！

代码在我的情况下不起作用，并希望你看一下我创建的JS小提琴： http://jsfiddle.net/Qqe89/

Answer 1

undefined已经提出了解决方案。

我会警告你使用这种方法，如果你向.box div添加任何类，那么你的代码就会中断。

而是考虑使用数据属性来定位要切换的div：

<div data-toggle-target="open1" class="box green"></div>

<div id="open1">
    Opens
</div>

然后可以使用

进行定位

$('.box').click(function (e) {
    $( '#' + $(this).data('toggleTarget') ).slideToggle(300);
});

jsFiddle使用您的html示例 - 粗略格式化抱歉！

Answer 2

$(".box").click(function() {
       var Klassen = $(this).attr("class");
       $("."+Klassen).slideToggle(300);
});

Answer 3

class属性可能包含多个类（$(this).attr("class") OR this.className）

$("."+Klassen)将无效
“Klassen”与任何DOM元素都不对应，因为HTML中没有此类标记。

单击div时 - 滑动其他div

3 个答案: