2016-04-27 66 views
0

这是我的menu.php,它构建了一个考虑用户配置文件的Bootstrap菜单。 当我在手机上试用时,菜单下拉菜单不会出现(应该位于手机菜单的右侧)。 我找不到问题。Bootstrap移动导航栏菜单不工作

<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
    <meta charset="ISO-8859-1"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> 
 
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> 
 
    <meta http-equiv="cache-control" content="no-cache,no-store,must-revalidate" /> 
 
    <meta http-equiv="expires" content="Sat, 26 Jul 1997 05:00:00 GMT" /> 
 
    <meta name="description" content=""> 
 
    <meta name="author" content=""> 
 
    <link rel="icon" type="image/x-icon" href="../favicon.ico"> 
 

 
    <title>Gestão de Contratos</title> 
 

 
<!-- CSS ================================================== --> 
 
    <!-- Bootstrap Core CSS --> 
 
    <link href="../Bootstrap/css/bootstrap.min.css" rel="stylesheet"> 
 
    <link href="../Plugins/Bootstrap-table/dist/bootstrap-table.css" rel="stylesheet"> 
 

 
    <!-- Custom CSS --> 
 
    <link href="../Plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet"> 
 
    <link href="../CSS/navbar-fixed-top.css" rel="stylesheet"> 
 
    <link href="../CSS/docs.min.css" rel="stylesheet"> 
 

 
    <link href="../Plugins/msg.css" rel="stylesheet" type="text/css" > 
 

 
    <style> 
 
     .navbar-brand { float: left; height: 50px; padding: 5px 15px; font-size: 18px; line-height: 20px; vertical-align: bottom; } 
 

 
     .bs-docs-nav .navbar-brand, .bs-docs-nav .navbar-nav>li>a { font-weight: 500; color: #525252; } 
 

 
     .modal.modal-70wide .modal-dialog { width: 70%; } 
 
     .modal-70wide .modal-body { overflow-y: auto; } 
 
    </style> 
 

 
    </head> 
 

 
    <body class="bs-docs-home"> 
 

 
    <!-- Docs master nav --> 
 
    <header class="navbar navbar-fixed-top bs-docs-nav" id="top" role="banner"> 
 
    <div class="container"> 
 
     <div class="navbar-header"> 
 
     <a class="navbar-brand" href="page_principal.php"> 
 
      <img alt="Brand" width="auto" height="30" align="top" src="../Images/logovale.png"> 
 
     </a> 
 
     </div> 
 
     <nav id="bs-navbar" class="collapse navbar-collapse"> 
 
     <ul class="nav navbar-nav"> 
 

 
<li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Administrador <span class="caret"></span></a> 
 
      <ul class="dropdown-menu"> 
 
       <li role="navigation" class="dropdown-header" >Informações Gerais:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_fornecedor.php',0)">- Empresas e CNPJs</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_categoria.php',0)" >- Categorias</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_unidade.php',0)" >- Unidades Operacionais</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_centros.php',0)" >- Centros</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_municipio.php',0)" >- Municípios</a></li> 
 
       <li role="navigation" class="dropdown-header" >Cadastro de usuários:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_usuario.php?v=0',0)">- Administradores</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_usuario.php?v=1',0)">- Gestores de Categorias</a></li> 
 
      </ul> 
 
      </li><li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Gestor Categoria<span class="caret"></span></a> 
 
      <ul class="dropdown-menu"> 
 
       <li role="navigation" class="dropdown-header" >Informações Gerais:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_isscateg.php',1)" >- ISS</a></li> 
 
       <li role="navigation" class="dropdown-header" >Dados Básicos Contrato:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_funcao.php',1)"  >- Funções</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_equipamento.php',1)">- Equipamentos</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_epi.php',1)"  >- EPIs</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_exame.php',1)"  >- Exames</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_treina.php',1)"  >- Treinamentos</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_sindicato.php',1)" >- Sindicatos</a></li> 
 
       <li role="navigation" class="dropdown-header" >Gestão Contratos:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_contrato.php',1)" >- Contratos e OCs</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_sindxempr.php',1)" >- Grupos de Preços</a></li> 
 
       <li role="navigation" class="dropdown-header" >Cadastro de usuários:</li> 
 
       <li><a href="#" onclick="fazmenu('page_cadastro_usuario.php?v=2',1)">x Usuários Gestão Geral</a></li> <!-- GGI e GGE --> 
 
       <li role="navigation" class="dropdown-header" >Relatórios:</li> 
 
       <li><a href="#" onclick="fazmenu('page_relmensal.php',1)"   >x Relatório Mensal</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_relevolcusto.php',1)"  >x Evolução de Custos</a></li> 
 
      </ul> 
 
      </li><li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Gestão Contratante<span class="caret"></span></a> 
 
      <ul class="dropdown-menu"><li role="navigation" class="dropdown-header">Gestão Geral:</li> <!-- GGI --> 
 
         <li><a href="#">x Relatórios</a></li> 
 
         <li><a href="#" onclick="fazmenu('page_cadastro_usuario.php?v=3',1)">x Cadastro de Gestores e Fiscais</a></li> 
 
         <li><a href="#">x Medição</a></li><li role="navigation" class="dropdown-header">Gestão:</li> <!-- GI --> 
 
         <li><a href="#">x Postos (Mob/Desmob)</a></li> 
 
         <li><a href="#">x Emitir Notificação</a></li> 
 
         <li><a href="#">x Medição</a></li>  <li role="navigation" class="dropdown-header">Fiscalização:</li> <!-- FI --> 
 
       <li><a href="#">x Medição</a></li> 
 
       <li><a href="#">x Histórico Medições</a></li> 
 
       <li><a href="#">x Posto Descoberto</a></li> 
 
       <li><a href="#">x Descontos</a></li> 
 
      </ul> 
 
      </li><li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Gestão Contratada<span class="caret"></span></a> 
 
      <ul class="dropdown-menu"><li role="navigation" class="dropdown-header">Gestão Geral:</li> <!-- GGE --> 
 
         <li><a href="#">x Relatórios</a></li> 
 
         <li><a href="#" onclick="fazmenu('page_cadastro_usuario.php?v=4',1)">x Cadastro de Gestores e Fiscais</a></li> 
 
         <li><a href="#">x Medição</a></li> 
 
         <li><a href="page_cadastro_MDO.php">- Custos de Mão de Obra</a></li><li role="navigation" class="dropdown-header">Gestão:</li> <!-- GE --> 
 
         <li><a href="#">x Postos (Mob/Desmob)</a></li> 
 
         <li><a href="#">x Notificações</a></li> 
 
         <li><a href="#">x Medição</a></li>  <li role="navigation" class="dropdown-header">Fiscalização:</li> <!-- FE --> 
 
       <li><a href="#">x Medição</a></li> 
 
       <li><a href="#">x Histórico Medições</a></li> 
 
       <li><a href="#">x Posto Descoberto</a></li> 
 
       <li><a href="#">x Descontos</a></li> 
 

 
      </ul> 
 
      </li><li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Meu Cadastro<span class="caret"></span></a> 
 
      <ul class="dropdown-menu"> 
 
       <li><a href="#" onclick="fazmenu('page_meucadastro.php',0)" >- Alterar meu Cadastro</a></li> 
 
       <li><a href="#" onclick="fazmenu('page_altera_senha.php',0)" >- Alterar minha Senha</a></li> 
 
      </ul> 
 
      </li><li class="dropdown"> 
 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="glyphicon glyphicon-eye-open"></i> Indique a Categoria<span class="caret"></span></a> 
 
      <ul class="dropdown-menu"><li><a href="#" onclick="mudacat(5)">CFTV Operações e Peças Aternativas para Segurança</a></li><li><a href="#" onclick="mudacat(2)">Portaria e Serviços</a></li><li><a href="#" onclick="mudacat(3)">Segurança Eletrônica</a></li><li><a href="#" onclick="mudacat(1)">Vigilância</a></li> </ul> 
 
      </li> 
 
     </ul> <!-- FIM MENU nav navbar-nav --> 
 

 
     <!-- BOTÃO DE SAIR --> 
 
     <ul class="nav navbar-nav navbar-right"> 
 
      <li><a href="script_logout.php"><i class="glyphicon glyphicon-off"></i> Sair</a></li> 
 
     </ul> 
 

 
     </nav> 
 
    </div> <!-- container --> 
 
    </header> 
 

 
    <!-- form para executar script de página do menu --> 
 
    <div id="idchama" style="display:none"> 
 
    <FORM id="fchama" NAME="fchama" ACTION="xxx.php" target="_self" METHOD="POST"> 
 
     <input type="text" id="idCateg" name="idCateg" value="" > 
 
     <input type="submit" id="btchama"> 
 
    </FORM> 
 
    </div> 
 

 

 
    <!-- SCRIPTS Placed at the end of the document so the pages load faster 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> --> 
 
    <script src="../JS/jquery-1.11.3.min.js"></script> 
 
    <script src="../Bootstrap/js/bootstrap.min.js"></script> 
 
    <script src="../Plugins/Bootstrap-table/dist/bootstrap-table.min.js"></script> 
 
    <script src="../JS/bootstrap-table-mobile.js"></script> 
 
    <script src="../JS/bootstrap-table-export.js"></script> 
 
    <script src="../JS/tableExport.js"></script> 
 
    <script src="../JS/bootstrap-table-resizable.js"></script> 
 
    <script src="../JS/colResizable-1.5.source.js"></script> 
 

 
    <script src="../JS/Funcoes.js"></script> 
 

 
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 
 
    <script src="../JS/ie10-viewport-bug-workaround.js"></script> 
 

 
    <!-- dhtmlxGrid --> 
 
    <link rel="stylesheet"  href="../JS/dhtmlxGrid/codebase/dhtmlxgrid.css" type="text/css" /> 
 
    <script language="javascript" src="../JS/dhtmlxGrid/codebase/dhtmlxcommon.js"></script> 
 
    <script language="javascript" src="../JS/dhtmlxGrid/codebase/dhtmlxgrid.js"></script> 
 
    <script language="javascript" src="../JS/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script> 
 
    <style type="text/css"> 
 
     .csslingradeimpar{ background-color:#E6E6FA; } 
 
     .csslingradepar { background-color:#F0F8FF; } 
 
     .csslinhover  { background-color:#FFCCCC; } 
 
    </style> 
 

 
    <script src="../Plugins/msg.js"></script> 
 

 

 
<script> <!-- funções genéricas para todos --> 
 

 
document.getElementById('idCateg').value= '0'; 
 
function mudacat(c) 
 
{ 
 
    window.document.fchama.target= "_self";    // para abrir pagina na mesma tab 
 
    window.document.fchama.action= 'page_principal.php'; // script a carregar 
 
    document.getElementById('idCateg').value= c;   // passa por post a categoria nova 
 
    window.document.fchama.btchama.click();    // carrega page_principal.php reabre menu puro 
 
} 
 

 
$(".modal-70wide").on("show.bs.modal", function() { 
 
    var height = $(window).height() - 200; 
 
    $(this).find(".modal-body").css("max-height", height); 
 
}); 
 

 

 
// ============================== 
 
    function fazmenu(script,op) 
 
// ============================== 
 
{ 
 
    if((op == 1) && (document.getElementById('idCateg').value == '0')) 
 
    { 
 
    da_mensagem('Indique uma Categoria','a'); 
 
    xTimeout= setTimeout(deuTimeout,1500); 
 
    return false; 
 
    } 
 
    window.document.fchama.target= "_self"; 
 
    window.document.fchama.action= script; 
 
// document.getElementById('idCateg').value= categ; 
 
    window.document.fchama.btchama.click(); 
 
} 
 

 

 
var posretorno;  // posição inicial do proximo "registro" a ser extraido da string retornada 
 
var arraycampos = new Array();  // campos referentes a um "registro" extraido da string retornada 
 

 

 
</script> 
 

 
<!-- esta terminação tem que ser feita em cada tela que inclui o script_menu.php 
 
    </body> 
 
</html> 
 
--> 
 

 
    <div class="container"> 
 

 
    <div id="mensagem" class="ui-widget-content"> </div> 
 
    <div id="desabilita_msg" style="visibility:hidden" ></div> 
 

 
    </div> <!-- container vazio menu inicial --> 
 

 
    <script> // JAVASCRIPT DO MÓDULO DE UNIDADES 
 
    var xTimeout; 
 
    function deuTimeout() 
 
    { 
 
    clearTimeout(xTimeout); 
 
    document.getElementById("desabilita_msg").style.visibility="hidden"; 
 
    document.getElementById("mensagem").style.visibility="hidden"; 
 
    } 
 

 
</body> <!-- aberto no script_menu.php --> 
 
</html>

+0

您的代码段无法正常工作,因为您的包含内容并未加载到代码段中。 – Tricky12

回答

0

您缺少该显示在手机屏幕大小的菜单按钮的代码。你需要它在你的navbar-header里面。

<div class="navbar-header"> 
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-navbar" aria-expanded="false"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
    </button> 
    <a class="navbar-brand" href="page_principal.php"> 
     <img alt="Brand" width="auto" height="30" align="top" src="../Images/logovale.png"> 
    </a> 
</div>