1

我的页脚中有一个 jquery 手风琴菜单,效果很好,除了当子菜单打开时......页面没有导航到锚链接。由于这是在我的页脚中,我不得不向下滚动以查看打开的子菜单。我希望页面自动向下滚动。

任何想法为什么这不起作用?我也尝试将 id 放在 中,但这没有用。

我的html:

<ul class="footer-offices">
<li id="#sanfran" class="one"><a href="#sanfran">text</a>
  <ul class="submenu"><li>office info here</li></ul>
</li>
</ul>

jQuery是:

$(document).ready(function(){
$("ul.footer-offices li > a").on("click", function(e){
if($(this).parent().has("ul")) {
  e.preventDefault();  
}
if(!$(this).hasClass("open")) {
  // hide any open menus and remove all other classes
  $("ul.footer-offices li ul").slideUp(350);
  $("ul.footer-offices li a").removeClass("open");

  // open our new menu and add the open class
  $(this).next("ul").slideDown(350);
  $(this).addClass("open");   
}
else if($(this).hasClass("open")) {
  $(this).removeClass("open");
  $(this).next("ul").slideUp(350);
}       
}); });
4

2 回答 2

0

就是这部分:

<li id="#sanfran" class="one">

那个ID应该只是说sanfran,没有##in<a href="#sanfran"表示后面是ID,所以是#sanfran多余的。

应该是这样的:

<li id="sanfran" class="one">

其他一切看起来都很好。

于 2013-09-24T20:22:05.943 回答
0

这似乎是正确的:

<ul class="footer-offices">
  <li id="sanfran" class="one"><a href="#sanfran">San Francisco Headquarters</a>
    <ul class="submenu"><li>office info here</li></ul>
  </li>

  <li id="boston"><a href="#boston">Boston Headquarters</a>
    <ul class="submenu"><li>office info here</li></ul>
  </li>
</ul>

您的 ID 中是否有一个不应该存在的 # 标签?

你有这个:

<li id="#sanfran" class="one">

它应该是这样的:

<li id="sanfran" class="one">

更新:

您的 javascript 中的 preventDefault 是否阻止了跳转?

if($(this).parent().has("ul")) {
  e.preventDefault();  
}

如果你删除那段代码会发生什么?

于 2013-09-24T20:17:04.960 回答