Javascript 选择JS菜单在服务器中的行为与在我自己的桌面中的行为不同

几周前我发布了我的网站…但当我在手机上查看我的网站时（我制作了@mediaquerie for mobile），我可以看到JS选择菜单的行为非常奇怪（它出现了4次，与我的桌面不同）…你可以在这两张图中看到差异

如果您想查看代码，请访问以下网站：www.elenacostasoprano.com/contact.html

（它发生在所有页面中）

---

有人知道代码中可能有什么问题吗？

问题是您实际上包括了

选择
四次

事实上，如果您查看导航菜单，您将看到

<nav>
        <nav id="menu">
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="#">Bio</a>
                    <ul>
                        <li><a href="biography.html">Biography</a></li>
                        <li><a href="repertoire.html">Repertoire</a></li>
                    </ul>
                </li>   
                <li><a href="#">Gallery</a>
                    <ul>
                        <li><a href="media.html">Media</a></li>
                        <li><a href="photos.html">Photos</a></li>
                    </ul>
                </li>    
                <li><a href="agenda.html">Agenda</a></li>
                <li><a href="contact.html">Contact</a></li>
        </ul>
    <select><option selected="selected" value="">Go to...</option><option value="index.html">Home</option><option value="#">Bio</option><option value="biography.html">Biography</option><option value="repertoire.html">Repertoire</option><option value="#">Gallery</option><option value="media.html">Media</option><option value="photos.html">Photos</option><option value="agenda.html">Agenda</option><option value="contact.html">Contact</option><option value="https://www.facebook.com/elenacostasoprano">
        </option><option value="https://twitter.com/elenacpsoprano">
        </option><option value="https://www.youtube.com/channel/UCoRkjY7OEQFSs7KwmruUVPw">
        </option><option value="https://plus.google.com/u/0/115736588985404106684/about/p/pub">
        </option><option value="https://www.instagram.com/elenacostasoprano/">
        </option><option value="contact.html">EN</option><option value="de/kontakt.html">DE</option><option value="es/contacto.html">ES</option></select></nav>
    <nav>
        <select onchange="window.location.href=this.value;"> 
            <option value="index.html">Home</option>
            <option value="biography.html">Biography</option> 
            <option value="repertoire.html">Repertoire</option>
            <option value="media.html">Media</option>
            <option value="photos.html">Photos</option>
            <option value="agenda.html">Agenda</option>
            <option selected="selected" value="contact.html">Contact</option>
        <option selected="selected" value="">Go to...</option><option value="index.html">Home</option><option value="#">Bio</option><option value="biography.html">Biography</option><option value="repertoire.html">Repertoire</option><option value="#">Gallery</option><option value="media.html">Media</option><option value="photos.html">Photos</option><option value="agenda.html">Agenda</option><option value="contact.html">Contact</option><option value="https://www.facebook.com/elenacostasoprano">
        </option><option value="https://twitter.com/elenacpsoprano">
        </option><option value="https://www.youtube.com/channel/UCoRkjY7OEQFSs7KwmruUVPw">
        </option><option value="https://plus.google.com/u/0/115736588985404106684/about/p/pub">
        </option><option value="https://www.instagram.com/elenacostasoprano/">
        </option><option value="contact.html">EN</option><option value="de/kontakt.html">DE</option><option value="es/contacto.html">ES</option></select> 

    <select><option selected="selected" value="">Go to...</option><option value="index.html">Home</option><option value="#">Bio</option><option value="biography.html">Biography</option><option value="repertoire.html">Repertoire</option><option value="#">Gallery</option><option value="media.html">Media</option><option value="photos.html">Photos</option><option value="agenda.html">Agenda</option><option value="contact.html">Contact</option><option value="https://www.facebook.com/elenacostasoprano">
        </option><option value="https://twitter.com/elenacpsoprano">
        </option><option value="https://www.youtube.com/channel/UCoRkjY7OEQFSs7KwmruUVPw">
        </option><option value="https://plus.google.com/u/0/115736588985404106684/about/p/pub">
        </option><option value="https://www.instagram.com/elenacostasoprano/">
        </option><option value="contact.html">EN</option><option value="de/kontakt.html">DE</option><option value="es/contacto.html">ES</option></select></nav>
    <div id="extras">
    <div id="socialcontainersup">
    <p>
    <a title="Follow me on Facebook!" href="https://www.facebook.com/elenacostasoprano" target="_blank">
        <img style="margin-right:0px; margin-left:0px;" src="images/facebookmovil.png" onmouseover="this.src='images/facebookmovilhover.png'" onmouseout="this.src='images/facebookmovil.png'" alt="Facebook" width="32" height="32"></a>
    <a title="Follow me on Twitter!" href="https://twitter.com/elenacpsoprano" target="_blank">
        <img style="margin-right:0px; margin-left:0px;" src="images/twittermovil.png" onmouseover="this.src='images/twittermovilhover.png'" onmouseout="this.src='images/twittermovil.png'" alt="Twitter" width="32" height="32"></a>

    <a title="Subscribe to my YouTube channel!" href="https://www.youtube.com/channel/UCoRkjY7OEQFSs7KwmruUVPw" target="_blank">
        <img style="margin-right:0px; margin-left:0px;" src="images/youtubemovil.png" onmouseover="this.src='images/youtubemovilhover.png'" onmouseout="this.src='images/youtubemovil.png'" alt="Youtube" width="32" height="32"></a>

    <a title="Follow me on GooglePlus!" href="https://plus.google.com/u/0/115736588985404106684/about/p/pub" target="_blank">
        <img style="margin-right:0px; margin-left:0px;" src="images/googleplusmovil.png" onmouseover="this.src='images/googleplusmovilhover.png'" onmouseout="this.src='images/googleplusmovil.png'" alt="GooglePlus" width="32" height="32"></a>
    <a title="Follow me on Instagram!" href="https://www.instagram.com/elenacostasoprano/" target="_blank">
        <img style="margin-right:0px; margin-left:0px;" src="images/instagrammovil.png" onmouseover="this.src='images/instagrammovilhover.png'" onmouseout="this.src='images/instagrammovil.png'" alt="Instagram" width="32" height="32"></a>
    </p>
    </div>
    <div id="language">

        <span class="langswitcher">
            <a class="active" href="contact.html">EN</a>
            |
            <a href="de/kontakt.html">DE</a>
            |
            <a href="es/contacto.html">ES</a>
        </span>
    </div>
    </div>
    <h3>Contact</h3>

<select><option selected="selected" value="">Go to...</option><option value="index.html">Home</option><option value="#">Bio</option><option value="biography.html">Biography</option><option value="repertoire.html">Repertoire</option><option value="#">Gallery</option><option value="media.html">Media</option><option value="photos.html">Photos</option><option value="agenda.html">Agenda</option><option value="contact.html">Contact</option><option value="https://www.facebook.com/elenacostasoprano">
        </option><option value="https://twitter.com/elenacpsoprano">
        </option><option value="https://www.youtube.com/channel/UCoRkjY7OEQFSs7KwmruUVPw">
        </option><option value="https://plus.google.com/u/0/115736588985404106684/about/p/pub">
        </option><option value="https://www.instagram.com/elenacostasoprano/">
        </option><option value="contact.html">EN</option><option value="de/kontakt.html">DE</option><option value="es/contacto.html">ES</option></select></nav>

这基本上意味着“隐藏每个
ul
并显示放置在
nav
元素中的每个
select
元素”

要解决此问题，您只需去掉每一个
select
，只选择一个即可

还请注意，html和css中都存在一些错误。
使用验证器帮助您发现并纠正这些问题。网上有很多，比如（CSS）

最好的
 谢谢，我已经在我的网站上看到了这些代码，但是我桌面上的原始代码不是这样的，我没有四次编写“选择菜单”！代码如下

在这里你可以看到我的桌面上的代码不是那样的，我也在css中使用了这些代码…所以在我的桌面上工作得非常好
 在媒体查询中，600px和768px标记之间存在差距。这就是元素没有被样式化的原因。杰夫，对不起，我看不出来！但是，除了选择菜单之外，其余所有元素都是样式化的，它在服务器中的行为很奇怪（但在我的计算机中不是）
@media only screen and (max-width: 600px){
  nav ul     { display: none; }
  nav select { display: inline-block; }
} /*Note: This last bracket miss in the original css*/