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

これは正しいようです：

<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 に答える