0

我想我的问题需要更多解释。我正在尝试让我的下拉菜单在 ipad 上正常运行。我有顶级菜单项和子菜单项。当我点击顶层时，子菜单会下拉，这是正确的。然后，当我从子菜单项中点击一个时，我的 html 页面会加载到我的 index.html (#!affordable-holidays.html) 中。问题是当 html 动态加载时，子级别下拉菜单不会消失。因此，一旦我点击了父项，子菜单就会永远存在。

我认为在动态加载的 html 顶部有一些 javascript 来隐藏 ul 会起作用。

我不确定页面如何加载的正确术语，因为这是购买的模板。例如，mysite.com 将是索引，然后当我转到另一个页面时，它是 mysite.com#!second-page.html

页面加载时如何在菜单中隐藏 ul？这是我的html

<li><a href="#">Tester</a>
    <ul class="menu-hide">
       <li ><a href="#!pay-as-you-go.html"><span class="title">PAY AS YOU GO</span></a></li>
       <li ><a href="#!affordable-holidays.html"><span class="title">AFFORDABLE HOLIDAYS ALWAYS</span></a></li>
       <li ><a href="#!how-points-work.html"><span class="title">HOW POINTS WORK</span></a></li>
       <li ><a href="#!more-than-a-room.html"><span class="title">MORE THAN A ROOM</span></a></li>
    </ul>
</li>

这是我发现的接近我想要的javascript：

<script type="text/javascript">$("div.menu-hide").hide()</script>

但我似乎无法定位 ul.menu-hide。我试过这个

<script type="text/javascript">$("ul.menu-hide").hide()</script>
4

3 回答 3

2

您似乎缺少您的 document.ready 电话

<script type="text/javascript">$(document).ready(function(){$("ul.menu-hide").hide()});</script>

还要确保在您的其他 javascript之前声明到您的 jQuery 库的链接

http://api.jquery.com/ready/

于 2012-09-25T11:30:45.523 回答
2

尝试这个 

<script type="text/javascript">
  $(window).load(function () {

   $("div.menu-hide").hide()
  })
</script>

你也可以使用

 $(window).ready(function () {

       $("div.menu-hide").hide()
      })

但不同之处在于，即使尚未加载所有图形，当加载 HTML 文档并且 DOM 准备好时，文档就绪事件也会执行。

窗口加载事件在整个页面完全加载后执行，包括所有框架、对象和图像。

好读

$(document).ready 与 $(window).load

于 2012-09-25T11:29:38.440 回答
1

通过 JavaScript 在页面加载时隐藏 HTML 元素将导致该元素在显示然后隐藏时产生闪烁效果。

我会用你的 css 文件隐藏元素，然后通过 JavaScript 显示。

CSS代码：

.menu-hide{ display: none; }

jQuery 显示代码：

$(function(){
    $('.menu-hide').show();
});
于 2012-09-25T11:32:19.413 回答