Stiftung 6 Untermenü nicht Expand Arbeits

Question

Im 6

Dies ist mein Code Bereitstellen Untermenü in MVC6 + Foundation versucht:

<div dir="rtl" style="height:100%"> 
    <div class="off-canvas-wrapper" style="height: 799px;"> 
     <div class="off-canvas-wrapper-inner is-off-canvas-open is-open-right" data-off-canvas-wrapper="" style="height: 799px;"> 
      <aside class="off-canvas position-right is-open" id="offCanvas" data-off-canvas="e16988-off-canvas" data-position="right" aria-hidden="false" style="height: 799px;"> 
       <ul class="off-canvas-list"> 
          <li><a href="#" class="normal off-canvas-submenu-call">Menu one<span class="right">+</span></a> 
            <ul class="off-canvas-submenu" style="display: none;"> 
             <li><a href="/SubMenuOne" >SubMenu One</a></li> 
            </ul> 
           </li> 
          <li><a href="/MenuTwo" class="normal">Menu Two </a> 
           </li> 
       </ul> 
      </aside> 
      <div class="main-content" data-off-canvas-content=""> 
       <div class="title-bar"> 
        <div class="title-bar-right"> 
         <button class="menu-icon" type="button" data-open="offCanvas" aria-expanded="true" aria-controls="offCanvas"></button> 
         <span class="title-bar-title">Mane List</span> 
        </div> 
       </div> 

       <div class="row"> 
        <div class="large-12 columns"> 
         <h1></h1> 
        </div> 
       </div> 

      <div class="js-off-canvas-exit is-visible"></div></div> 

     </div> 
    </div> 
</div> 

Und Js:

<script> 
     $(window) 
     .load(function() { 
      SetOffCanvasHeight(); 
     }) 
     .resize(function() { 
      SetOffCanvasHeight(); 
     }); 

     function SetOffCanvasHeight() { 
      var height = $(window).height(); 
      var contentHeight = $(".off-canvas-content").height(); 
      if (contentHeight > height) { height = contentHeight; } 

      $(".off-canvas-wrapper").height(height); 
      $(".off-canvas-wrapper-inner").height(height); 
      $(".off-canvas").height(height); 
     } 
     $(".off-canvas-submenu").hide(); 
     $(".off-canvas-submenu-call").click(function() { 
      var icon = $(this).parent().next(".off-canvas-submenu").is(':visible') ? '+' : '-'; 
      $(this).parent().next(".off-canvas-submenu").slideToggle('fast'); 
      $(this).find("span").text(icon); 
     }); 
    </script> 

das oben stehende Menü nicht angezeigt Jeder Fehler in der Debugger-Konsole und im Menü wird gut angezeigt. Aber wenn ich auf das Menü mit dem Untermenü klicke, ändert sich nur "+" zu "-" und Untermenü nicht mehr.

Im diese Probe als Leitfaden:

http://codepen.io/designsoutheast/pen/ZYERGo

Answer 1

Dies ist Problem in jquery. Ersetzen Code mit diesem:

$(".off-canvas-submenu-call").click(function() { 
     var icon = $(this).next(".off-canvas-submenu").is(':visible') ? '+' : '-'; 
     $(this).next(".off-canvas-submenu").slideToggle('fast'); 
     $(this).find("span").text(icon); 
    });