扩展我的JavaScript代码

我已经制作了一个水平菜单，它的工作原理就像点击时的制表符变换器

我想在JavaScript中添加一些代码，这些代码将占用另一个div

id=“rest”

，并在我更改第一个（活动）选项卡的同时将其关闭（使其隐藏）。为了更好地解释我的情况，我附上了一张图片：

我只需要在更改

divid=“defaultOpen”

时，隐藏另一个带有

id=“rest”

的div

函数openCity（evt，cityName）{
var i，tabcontent，tablinks；
tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i













您可以通过使用Javascript DOM事件监听器来解决此问题

// Function to add event listener to table

var el = document.getElementById("prescription"); //(Name your #ID here)
el.addEventListener("click", function(){document.getElementById('rest').style.display = "block";}, false);

在这里您可以看到
您对需求的描述让我有点困惑。我看过你的设计。请确认这是否是期望值：

页面加载=
有5个（divid=rest）元素。每个顶级选项卡一个。除第一个处于活动状态的顶部选项卡外，所有（div id=rest）元素均隐藏

用户单击顶部选项卡2=
现有的可见（div id=rest）元素变为隐藏。第二个（divid=rest）元素变为可见，以此类推

如果这是您的要求，那么：

不要命名你的（div id=rest），命名他们（div class=rest rest）（div class=rest rest2）（div class=rest rest3）等等，因为页面上应该只有一个id

对于每个（div class=tab），添加一个属性（div class=tab data controls=rest1）。（div class=tab data controls=rest2）对应于要显示的div rest

在函数内部，您可以获取当前选项卡的属性和要打开的目标（div class=rest）

我在您的html中没有看到任何id=“rest”。此外，没有tabcontent、tablinks和active的类名。