Question

我目前有以下设置:(隐藏所有具有“秘密”类别的div）

<div class="row">
    <div class="block align">
        <a class="desktop" data-toggle-target="click-1">
        </a>
    <div>
    <div class="block align">
        <a class="desktop" data-toggle-target="click-2">
        </a>
    <div>
<div>
<div class="row">
    <div id="click-1" class="secret">
        stuff
    <div>
    <div id="click-2" class="secret">
        stuff
    <div>
<div>
<div class="row">
    <div class="block align">
        <a class="desktop" data-toggle-target="click-3">
        </a>
    <div>
    <div class="block align">
        <a class="desktop" data-toggle-target="click-4">
        </a>
    <div>
<div>
<div class="row">
    <div id="click-3" class="secret">
        stuff
    <div>
    <div id="click-4" class="secret">
        stuff
    <div>
<div>

我使用以下

滑动一次

$('.align .desktop').click(function (e) {
    $( '#' + $(this).data('toggleTarget') ).slideToggle(300).toggleClass('open');        
});

问题是，如果我点击data-toggle-target =“click-2”打开相应的div，我需要先打开关闭的任何其他div，然后有相应的div slideToggle

Answer 1

你的HTML结构并不适合这种类型的东西，但将一系列选择器链接在一起可以实现这一点：

$('.align .desktop').click(function (e) {
   var target = $(this).data('toggleTarget');
   $( '#' + target).siblings(".secret").slideUp().end().closest(".row").siblings(".row").find(".secret").slideUp().end().end().end().slideToggle(300).toggleClass('open');        
});

FIDDLE

Answer 2

因为你使用JQuery将他们的BuildIn函数用于Accordion http://jqueryui.com/accordion/

更新：或者您的Structur编写一个首先关闭所有块的函数，然后打开Clicked。

仅在前一个元素关闭后滑动div

2 个答案: