Javascript 用一个onclick切换2个div

我有两个div，我需要用一个按钮切换它们，第一个向上滑动，第二个向下滑动

HTML 达斯达斯达斯德

有人能帮我吗

---

使用

类

或

名称

属性，而不是

id

HTML

<div class="nav" style="background:black; width:100%; height:95px">dasdasdasdasd</div>
 <div class="nav" style="background:gray; height:200px"></div>

<button>Toggle 'em</button>

PS

---

切勿对两个元素使用相同的

id

。

id

应该是唯一的。

重复的id是无效的html，您应该改用class

您还需要在开始时隐藏一个元素以进行切换：

$( "button" ).click(function() {
  $( ".nav" ).slideToggle( "slow" );
});

---

您可以使用

class

而不是

id

，并使用

display:none将一个
div
隐藏起来

html:

您需要隐藏一个元素以进行不同的切换

$( "button" ).click(function() {
  $( "#nav1" ).slideToggle( "slow" );
    $( "#nav2" ).slideToggle( "slow" );
});

您的
div
的id似乎是
nav
。为了选择2个div，您可以尝试为这两个div分配相同的类名称，例如：
（x2）

然后将jQuery更改为：
$（'.nav'）.slideUp（）

这样，jQuery就知道同时选择两个div并将它们向上滑动

Html

<div id="nav1" style="background:black; width:100%; height:95px">dasdasdasdasd</div>
<div id="nav2" style="background:gray; height:200px"></div>

脚本

$( "button" ).click(function() {
  $( "#nav1,#nav2" ).slideToggle( "slow" );
});

谢谢，但我需要同时删除两个div，页眉使用slideup，页脚使用slideup。可能吗？@Amir:你可以使用
滑动切换
而不是
切换
。看看答案。现在更新了…你能给我举个例子吗，slidetoggle只是应用在一个类上，这不是我需要的，想象一下当你点击按钮时，我的两个div都应该从第一页向上移动，一个从下移动，这对你有意义吗？@Amir：在这种情况下，你需要使用动画而不是slidetoggle。toggle不提供指定方向的选项。由于nav之前的哈希，jQuery只搜索第一个元素（ID应该是唯一的）。因此，只有第一个元素将隐藏在您的版本中。代码中的所有内容都是正确的，除了散列。在你可以的地方尝试使用类！
<div class="nav" style="background:black; width:100%; height:95px">dasdasdasdasd</div>
 <div class="nav" style="background:gray; height:200px;display:none;"></div>

<button>Toggle 'em</button>

$( "button" ).click(function() {
  $( ".nav" ).toggle( "slow" );
});

$( "button" ).click(function() {
  $( "#nav1" ).slideToggle( "slow" );
    $( "#nav2" ).slideToggle( "slow" );
});

<div id="nav1" style="background:black; width:100%; height:95px">dasdasdasdasd</div>
<div id="nav2" style="background:gray; height:200px"></div>

#nav1{
    display:none;
}

$( "button" ).click(function() {
  $( "#nav1,#nav2" ).slideToggle( "slow" );
});