2011-11-08 2 views
0

誰かが私に何かを見せてくれることを願っています a)現在の問題の原因b)Wordpressで生成されたフォームのリスト要素を展開したり折りたたんだりする奇妙な問題

私はWordpressブログからすべてのページを抜き出しています。アイデアは、ユーザーがインタラクションするときにサブナビゲーションが拡大縮小するメニューを作成することです。

次のようにネストされたメニューのマークアップは、本質的である:

<nav id="projects"> 
<ul class="menu"> 
    <li class="page_item page-item-249"> 
     <a href="...">Selected projects</a> 
     <ul class="children"> 
      <li class="page_item page-item-298"><a href="..." >Level 2</a></li> 
      <li class="page_item page-item-263"><a href="..." >Level 2</a></li> 
      <li class="page_item page-item-212"><a href="..." >Level 2</a></li> 
     </ul> 
    </li> 
    <li class="page_item page-item-238"> 
     <a href="...">Archive</a> 
     <ul class="children"> 
      <li class="page_item page-item-33"> 
       <a href="...">Level 2</a> 
       <ul class="children"> 
        <li class="page_item page-item-46"><a href="...">Level 3</a></li> 
        <li class="page_item page-item-48"><a href="...">Level 3</a></li> 
       </ul> 
      </li> 
      <li class="page_item page-item-35"> 
       <a href="...">Level 2</a> 
       <ul class="children"> 
        <li class="page_item page-item-52"><a href="...">Level 3</a></li> 
        <li class="page_item page-item-57"><a href="...">Level 3</a></li> 
        <li class="page_item page-item-59"><a href="...">Level 3</a></li> 
        <li class="page_item page-item-61"><a href="...">Level 3</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li> 
</ul> 

次のようにjQueryのです:

$(".page_item a").click(function(){ 

    /* Set vars */ 
    var $this = $(this); 
    var isActive = false; 
    var hasSublinks = false; 
    var nextLevel = $(this).next("ul"); 

    if ($this.next().html() !== null) {hasSublinks = true;} 
    if ($this.hasClass('active')) {isActive = true;} 

    if (!hasSublinks) { 
     return true; 
    } else { 
     /* I have sub links... */ 
     if (!isActive) { 
      /* I am not active */ 
      $(".active").removeClass("active"); 
      $(".children").slideUp(); 

      $(this).next("ul").slideDown(); 
      $(this).addClass('active'); 

     } else { 
      $(nextLevel).slideUp(); 
      $(this).removeClass('active'); 

     } 
     return false; 
    } 

}); 

私は[アーカイブ]をクリックすると、それは期待どおりに子リストを展開します。ただし、ここでリンクをクリックすると、スライドして次のレベル(レベル3)が表示されることが期待されますが、逆の効果があります。に移動すると反対です。

私は、Wordpress Codexで何が問題になっているかを見極めるために多大な時間を費やしました。特にこのコードは以前から働いていた(または思った)のです。私はコードが一番クリーンでないことを知っていますので、私が間違っている場所を私に見せてくれることを本当に望んでいます!

おかげ

答えて

0

あなたはどこにでもアクティブクラスを持っていないようですので、あなたは、このやっているとき:

if ($this.hasClass('active')) {isActive = true;} 

をそれは設定ですから、この中に行く偽

に有効ですコードの一部:

if (!isActive) { 
     /* I am not active */ 
     $(".active").removeClass("active"); 
     $(".children").slideUp(); 

あなたのロジックには明らかに問題があります。それは、あなたが何も見つけなかったらヒントを与えるでしょう

+0

あなたはここに何か試しましたか? – GregM

関連する問題