简单更改后功能突然停止工作

function suddenly stopped working after a simple change

你好来自 Whosebug 的好人。

我有一个问题。

我最近在我的网站上添加了响应式菜单。它运作良好。但我添加了第二个不同的菜单。一款专为手机设计。我以正常比例隐藏它并在移动版本中显示它。但是该功能突然停止工作。除了一个名字没有改变,但那不应该干扰它。这是旧代码:

<div class="header">
        <div class="container">
            <ul class="nav">
                <li><a class="active_page" href="index.php">Home</a></li>
                <li><a href="projects.php">Projects</a></li>
                <li><a href="about.php">About</a></li>
                <li><a href="contact.php">Contact</a></li>
                <li class="icon">
                    <a href="javascript:void(0);" onclick="myFunction()">≡</a>
                </li>
            </ul>
        </div>
    </div>

这是新代码:

    <div class="header">
        <div class="container">
            <ul class="nav">
                <li><a class="active_page" href="index.php">Home</a></li>
                <li><a href="projects.php">Projects</a></li>
                <li><a href="about.php">About</a></li>
                <li><a href="contact.php">Contact</a></li>
            </ul>
        </div>
    </div>

    <div class="header_mobile">
        <div class="container">
            <ul class="nav">
                <li><a href="#">Home</a></li>
                <li><a href="projects.php">Projects</a></li>
                <li><a href="about.php">About</a></li>
                <li><a href="contact.php">Contact</a></li>
                <li class="icon">
                    <a href="javascript:void(0);" onclick="myFunction()">≡</a>
                </li>
            </ul>
        </div>
    </div>

最后是函数:

function myFunction() {
document.getElementsByClassName("nav")[0].classList.toggle("responsive");

}

它已全部 link 正确编辑,因为它以前工作过。我希望任何人都可以帮助我。

提前致谢。

编辑:这是网站的 link,只需将其缩放到手机即可查看:http://portfoliotristan.esy.es/index.php

function myFunction() {
  document.getElementsByClassName("nav")[1].classList.toggle("responsive");
}

您在第一个 'nav' 项目中 select。您需要通过将 0 更改为 1 来 select 第二个导航项。