分層元素的jquery代碼不適用於循環中的特定值

Question

我有一個邊欄下拉菜單，它使用jquery進行操作，但是當用戶單擊該項目時，頁面刷新並且菜單崩潰。爲了解決這個問題，就是爲了保持它的擴展性，我決定將REQUEST_URI和菜單項URL進行比較，如果發現我會觸發click事件。要做到這一點我用剪斷

$("a[href='<?php echo $citems->url;?>']").parents("li").parents("ul.dropdown-menu").prev(".dropdown-toggle").trigger("click"); 

其中除了出現在菜單項列表中倒數第三位置的特定項目的所有項目工作。下面是我正在執行的代碼，我面臨的問題：

<nav class="navbar navbar-default sidebar" role="navigation"> 
     <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-sidebar-navbar-collapse-1"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button>  
     </div> 
     <div class="collapse navbar-collapse" id="bs-sidebar-navbar-collapse-1"> 
     <ul class="nav navbar-nav asurion-sidebar" > 
      <?php 
      $nav_menu_items = wp_get_nav_menu_items('left-sidebar'); 
      $menu_items = wpse170033_nav_menu_object_tree($nav_menu_items); 
      $parents = get_post_ancestors($post->ID); 



      foreach($menu_items as $items) 
      { 

       $parents1 = get_post_ancestors($items->ID); 

       if(count($items->children) > 0) 
       { 

       ?> 
       <li class="dropdown first-level"> 
        <a href="#" class="dropdown-toggle " data-toggle="dropdown"><i class="fa <?php echo $items->classes[0];?>" aria-hidden="true"></i><?php echo $items->post_title;?> <i class="fa fa-angle-down menu-arrow" aria-hidden="true"></i></a> 
        <ul class="dropdown-menu forAnimate" role="menu"> 
        <?php 
         foreach($items->children as $citems) 
         { 
         if(count($citems->children) > 0) 
         {?> 
          <li class="dropdown thirdlevel "> 
          <a style="cursor:pointer" class="dropdown-toggle naveen" data-toggle="dropdown-submenu"><i class="fa <?php echo $citems->classes[0];?>" aria-hidden="true"></i><?php echo $citems->post_title;?><i class="fa fa-angle-down menu-arrow" aria-hidden="true"></i></a> 
           <ul class="dropdown-submenu forAnimate lastlevel" role="menu">  
           <?php 
           foreach($citems->children as $ccitems) 
           { 
            if(strpos($ccitems->url,'localhost')){ 
             $sea_domain = 'localhost'; 
            }elseif(strpos($ccitems->url,'asurion.com')){ 
             $sea_domain = 'asurion.com'; 
            } 
            $compareUrl = explode($sea_domain,$ccitems->url) ;      
              if($_SERVER['REQUEST_URI'] == $compareUrl[1]){ 
            ?> 
            <script> 
            $(document).ready(function(){ 
            $("a[href='<?php echo $ccitems->url;?>']").parents("li").parents("ul.dropdown-submenu").prev("a[data-toggle='dropdown-submenu']").trigger("click"); 
            }); 
            </script> 
            <?php } 
            echo "<li><a target='".$ccitems->target."' href='".$ccitems->url."'>".$ccitems->post_title."</a></li>"; 
           } 
           ?> 
           </ul> 
          </li> 
         <?php 
         } 
         else 
         { 
         if(strpos($citems->url,'localhost')){ 
           $sea_domain = 'localhost'; 
          }elseif(strpos($citems->url,'asurion.com')){ 
           $sea_domain = 'asurion.com'; 
          } 
          $compareUrl = explode($sea_domain,$citems->url);   
          echo "<li><a target='".$citems->target."' href='".$citems->url."'>".$citems->post_title."</a></li>"; 
          if($_SERVER['REQUEST_URI'] == $compareUrl[1]){ 
           ?> 
           <script> 
           $(document).ready(function(){ 
           $("a[href='<?php echo $citems->url;?>']").parents("li").parents("ul.dropdown-menu").prev(".dropdown-toggle").trigger("click"); 
          }); 
         </script><?php 
         } 
         } 
         } 
        ?> 
        </ul> 
       </li> 
       <?php 
       } 
       else 
       { 
       if(get_the_title($post->ID)=="Dashboard" && $items->post_title=="Home" && count($parents)==0) 
       { 
        echo "<li class='active'><a target='".$items->target."' href='".$items->url."'> <i class='fa ".$items->classes[0]."' aria-hidden='true'></i>".$items->post_title."</a></li>"; 
       } 
       else 
       { 
        echo "<li><a target='".$items->target."' href='".$items->url."'> <i class='fa ".$items->classes[0]."' aria-hidden='true'></i>".$items->post_title."</a></li>"; 
       } 

       } 
      } 

      ?> 
     </ul> 
     </div> 
     </div> 
    </nav> 

任何幫助，將不勝感激。

在這裏被重複陣列，用於邊欄菜單：所述陣列的量，jquery的片段失敗的項目中的一個在Array，這裏是「設備」，「電話模擬器」

下>這是從來源Extracted HTML code代碼（它不包含js代碼爲小提琴犯規讓js代碼在HTML部分被writtent，找JS代碼，上面滾動）

Answer 1

我無法想象，爲什麼你輸出

<script> 
           $(document).ready(function(){ 
           $("a[href='<?php echo $ccitems->url;?>']").parents("li").parents("ul.dropdown-submenu").prev("a[data-toggle='dropdown-submenu']").trigger("click"); 
           }); 
           </script> 

在

循環，它會讓你的HTML代碼看起來凌亂。你根本不應該輸出那麼多的$(document).ready(...)。

你可以給你的<A />一個特殊的類名如'xxx'，並在</body>之前輸出腳本代碼。

<script> 
           $(document).ready(function(){ 
           $("a.xxx").parents("li").parents("ul.dropdown-submenu").prev("a[data-toggle='dropdown-submenu']").trigger("click"); 
           }); 
           </script> 

這樣會好一點。

如果你想保持菜單的狀態，你應該使用cookie或localStorage，而不是這樣。

和jsfiddle希望你分開你的html，css，js代碼，但通過你的方式，你的html和js不能分開，這不好。你可以提供一些CSS讓jsfiddle結果頁面看起來更好，它可以幫助別人理解你的結構。