jQuery автоматически закрывает главные меню

Я работаю над проектом, и мой горизонтальный бар меню плохо работает, потому что я хочу, чтобы мое главное меню автоматически закрывалось, когда я нажимаю на них.jQuery автоматически закрывает главные меню

Вот мой код:

$(document).ready(function() {   
    // sidebar menu click 
    $('.templatemo-sidebar-menu li.sub a').click(function(){ 
     if($(this).parent().hasClass('open')) { 
      $(this).parent().removeClass('open'); 
     } else { 
      $(this).parent().addClass('open'); 
     } 
    }); // sidebar menu click 
}); // document.ready

источник

2015-10-17 Shariq Zameer

Добавьте свой HTML код, пожалуйста. –

Теги для: Javascript, Java, C#, C++, asp.net, в заголовке есть JQuery и комментарий запрашивает HTML. Вау! Серьезно: я не знаю точно, какие теги подходят, но, пожалуйста, убедитесь, что присутствуют только правильные. –

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="Admin_Master_MasterPage" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <meta charset="utf-8"> 
    <title>Admin</title> 
    <meta name="keywords" content="" /> 
    <meta name="description" content="" /> 
    <meta name="viewport" content="width=device-width">   
    <link rel="stylesheet" href="../css/templatemo_main.css"> 
    <link href="../MsgboxJs/myMessage.css" rel="stylesheet" type="text/css" /> 
    <script src="../MsgboxJs/MsgboxJQuery.js" type="text/javascript"></script> 
    <link href="../TableCss.css" rel="stylesheet" type="text/css" /> 
    <!-- Messagebox FadeIn FadeOut --> 
    <script type="text/javascript" language="javascript"> 
     $(document).ready(function() { 
      $("#messageBox").addClass("messagebox"); setTimeout(function() { 
       $("#messageBox").fadeOut("slow") 
      }, 3000); 
     }); 
     function successmessagebox(nmsg) { 
      $("#messageBox").removeClass().addClass("success").html(nmsg).fadeIn(2000).fadeOut(4000); 
     } 
     function informationbox(wmsg) { 
      $("#messageBox").removeClass().addClass("warning").html(wmsg).fadeIn(2000).fadeOut(4000); 
     } 
     function errormsgbox(emsg) { 
      $("#messageBox").removeClass().addClass("error").html(emsg).fadeIn(2000).fadeOut(4000); 
     } 
     function validationmsgbox(emsg) { 
      $("#messageBox").removeClass().addClass("validation").html(emsg).fadeIn(2000).fadeOut(4000); 
     } 
    </script> 

    <asp:ContentPlaceHolder id="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body onload="startTime();" > 
    <form id="form1" runat="server" runat="server" autocomplete="off"> 
    <div> 

    <div class="navbar navbar-inverse" role="navigation"> 






     <div class="navbar-header"> 

     <div class="logo" ><h1> Admin-OurTenders</h1> 




     </div> 

     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <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> 
    <div class="template-page-wrapper"> 

     <div class="navbar-collapse collapse templatemo-sidebar"> 
     <ul class="templatemo-sidebar-menu"> 

      <li class="active"><a href="#"><i class="fa fa-home"></i>Dashboard</a></li> 
      <li class="sub open"> 
      <a href="javascript:;"> 
       <i class="fa fa-cog"></i> Master Menu <div class="pull-right"><span class="caret"></span></div> 
      </a> 

      <ul class="templatemo-submenu"> 

       <li><a href="Activities.aspx">Add Activities</a></li> 
       <li><a href="City.aspx">Add City</a></li> 
       <li><a href="Region.aspx">Add Region</a></li>    
       <li><a href="Issuer.aspx">Add Issuer</a></li> 

      </ul> 

      </li> 
      <li class="sub open"> 
      <a href="javascript:;"> 
       <i class="fa fa-database"></i> Tender <div class="pull-right"><span class="caret"></span></div> 
      </a> 
      <ul class="templatemo-submenu"> 
       <li><a href="../Tender/reg.aspx">New Tender</a></li> 
       <li><a href="../Tender/Tender.aspx">Latest Tender</a></li> 
       <li><a href="../Tender/CorrigendumTender.aspx">Corrigendums Tender</a></li>    

      </ul> 
      </li> 
     <li class="sub open"> 
      <a href="javascript:;"> 
       <i class="fa fa-users"></i> Manage Users <div class="pull-right"><span class="caret"></span></div> 
      </a> 
      <ul class="templatemo-submenu"> 
       <li><a href="../User/reg.aspx">New User</a></li> 
       <li><a href="../User/ActivationUser.aspx">Active Account Request</a></li> 
       <li><a href="../User/Useractive.aspx">User Account</a></li>    

      </ul> 
      </li> 

      <li><a href="#" data-toggle="modal" data-target="#confirmModal"><i class="fa fa-sign-out"></i>Sign Out</a></li> 
     </ul> 
     </div><!--/.navbar-collapse --> 

    <div class="templatemo-content" style="background-color:#F0EBE6"> 
     <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> 

     </asp:ContentPlaceHolder> 


    </div> 
    <!-----------------------FOOTER START HERE -----------------------------------> 
     <footer class="templatemo-footer"> 
     <div class="templatemo-copyright"> 
      <p>Copyright &copy; 2015 OurTender</p> 
     </div> 
     </footer> 
    </div> 

    <script src="../js/jquery.min.js"></script> 
    <script src="../js/bootstrap.min.js"></script> 
    <script src="../js/Chart.min.js"></script> 
    <script src="../js/templatemo_script.js"></script> 
    <script type="text/javascript"> 
     // Line chart 
     var randomScalingFactor = function() { return Math.round(Math.random() * 100) }; 
     var lineChartData = { 
      labels: ["January", "February", "March", "April", "May", "June", "July"], 
      datasets: [ 
     { 
      label: "My First dataset", 
      fillColor: "rgba(220,220,220,0.2)", 
      strokeColor: "rgba(220,220,220,1)", 
      pointColor: "rgba(220,220,220,1)", 
      pointStrokeColor: "#fff", 
      pointHighlightFill: "#fff", 
      pointHighlightStroke: "rgba(220,220,220,1)", 
      data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()] 
     }, 
     { 
      label: "My Second dataset", 
      fillColor: "rgba(151,187,205,0.2)", 
      strokeColor: "rgba(151,187,205,1)", 
      pointColor: "rgba(151,187,205,1)", 
      pointStrokeColor: "#fff", 
      pointHighlightFill: "#fff", 
      pointHighlightStroke: "rgba(151,187,205,1)", 
      data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()] 
     } 
     ] 

     } 

     window.onload = function() { 
      var ctx_line = document.getElementById("templatemo-line-chart").getContext("2d"); 
      window.myLine = new Chart(ctx_line).Line(lineChartData, { 
       responsive: true 
      }); 
     }; 

     $('#myTab a').click(function (e) { 
      e.preventDefault(); 
      $(this).tab('show'); 
     }); 

     $('#loading-example-btn').click(function() { 
      var btn = $(this); 
      btn.button('loading'); 
      // $.ajax(...).always(function() { 
      // btn.button('reset'); 
      // }); 
     }); 
    </script> 

    </div> 
    </form> 
</body> 
</html>

источник

2015-10-17 10:00:56

jQuery автоматически закрывает главные меню

ответ

Смежные вопросы