Javascript jQuery显示隐藏多个链接幻灯片切换div

我有一个关于切换效果的问题。我已经设法能够切换到同一个div，这是我的目标，我的问题是我想添加一个效果，即如果（toggle1）打开，我点击toggle2，它将关闭toggle1并打开toggle2。现在，如果您单击任何切换，它只会根据其所处的状态打开和关闭切换。我希望能够在单击其他切换时切换div中的任何内容。我希望这是有道理的

HTML

---

您可以使用此的一个实例，并且每个链接需要两个div：

<a href="#" id="toggle3">Slide Toggle3</a>
<div class="toggle" style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

<br><br>

<a href="#" id="toggle4">Slide Toggle3</a>
<div class="toggle" style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

---

演示：

你需要这样的东西吗

  $('#toggle4').click(function () {
               $('.toggle').hide();
                $('.toggle').slideToggle('1000');
                 return false;
                });

---

我不确定你想要实现什么，但根据我的理解，这可能是你想要的。 滑动开关3

滑动开关4

$（函数（）{
$（'#toggle4'）。单击（函数（）{
$（'.toggle'）.hide（'1000'）；
$（'.toggle'）.text（'toggle 4 clicked'）；
$（'.toggle'）.slideToggle（'1000'）；
返回false；
});
});
$（函数（）{
$（'#toggle3'）。单击（函数（）{
$（'.toggle'）.hide（'1000'）；
$（'.toggle'）.text（'toggle 3 clicked'）；
$（'.toggle'）.slideToggle（'1000'）；
返回false；
});
});

---

只打开和关闭每个链接。我需要它来打开和关闭同一个分区。想象一个导航，打开和关闭一个分区。这就是我拍摄的目的。它是根据它的状态打开和关闭的。假设我单击“切换1”打开，然后单击“切换2”，它会关闭第一个切换，但不会打开切换2所需的内容。@Keith--使用

$（“.toggle”）.slideUp（）

然后紧接着

slideDown（）

。是的，除非您单击第一个切换并将其打开，否则我希望在单击第二个切换打开新信息时能够关闭该切换。

<a href="#" id="toggle3">Slide Toggle3</a>
<div class="toggle" style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

<br><br>

<a href="#" id="toggle4">Slide Toggle3</a>
<div class="toggle" style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

$("#toggle3, #toggle4").click(function() {
    $(this).next(".toggle").slideToggle("slow");
});

  $('#toggle4').click(function () {
               $('.toggle').hide();
                $('.toggle').slideToggle('1000');
                 return false;
                });

 </div>


    $(function() {
    $('#toggle4').click(function () {
        $('.toggle').hide('1000');
        $('.toggle').text('toggle 4 clicked');
    $('.toggle').slideToggle('1000');

    return false;
        });
});

    $(function () {
    $('#toggle3').click(function () {
        $('.toggle').hide('1000');
         $('.toggle').text('toggle 3 clicked');
    $('.toggle').slideToggle('1000');

    return false;
        });
    });