切换折叠菜单始终打开

时间:2014-09-18 12:57:47

标签: javascript jquery css3

当我点击按钮时,切换打开menù但是当我点击第二次菜单时没有关闭...任何想法?对不起,这是我第一次访问这个网站!

<nav class="navbar navbar-default navbar-fixed-top gradient" role="navigation" >
  <div class="navbar-header" >
    <!-- Navbar visualizzata su dispositivi mobili-->
     <button class="navbar-toggle collapsed" data-target="#prova" data-toggle="collapse" type="button">
      <span class="sr-only" >Menu di navigazione</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
     </button>

     <!-- Navbar-brand visualizzata in alto a sinistra-->
     <!-- Indica la sezione del "titolo". href indica il link sul titolo. Color fa               riferimento al titolo. -->
     <a class="navbar-brand gradient text-navbar" href="index.html">Annotaria
     <!--Icona medicina -->
     <img src="http://www.notizieprovita.it/wp-content/uploads/2013/05/farmacisti_obiezione-di-coscienza_pillola-del-giorno-dopo.jpg" height="100%"/></a>
     </div> <!--Chiuso il div della navbar-header -->



     <div class="nav navbar-collapse collapse  gradient" id="prova" >
     <ul class=" nav navbar-nav" >
     <!--About sessione. data-target fa fronte a cosa caricheremo una volta attivato il modale. -->
        <li><a data-target="#about" data-toggle="modal" role="button" href="#" class="text-navbar">About</a></li>
        <!--Annotazioni non salvate navbar -->
        <li><a id="temp_annot_button" data-target="#temp_annot" data-toggle="modal" role="button" class="text-navbar hide">Annotazioni non salvate</a></li>
        <!--Crea Annotazioni navbar -->
        <li><a id="create_ranged_annot_button" onclick='lightText()' data-target="#doc_annot" data-toggle="modal" role="button" class="text-navbar  hide">Crea annotazioni</a></li>
        <!--Annotator Mode -->
        <li><a id="annotatorPanel" data-toggle="modal" onclick="togliModale()" data-target="#loginModal" role="button" class="text-navbar">Annotator Mode</a></li>
        <!--Help-->
        <li><a data-target="#help" data-toggle="modal" role="button" href="#" class= "text-navbar">Help</a></li>
       </ul>
   </div>
</nav>  <!--Chiudo la definizione della nostra navbar -->

posto il codice javascript che ho inserito!

<!--javascript code -->
<script language="javascript"> 
    function lightText() {                               //funzione che memorizza il testo selezionato
        var testoevidenziato= window.getSelection();
        alert (testoevidenziato.toString());
    }

    function togliModale(){                             //rimuove l'attributo data-dismiss
        $('#login').removeAttr('data-dismiss')
    }
</script>

1 个答案:

答案 0 :(得分:0)

找到了解决方案!

你已经两次包括引导程序了。如果你删除其中一个包含它的工作原理。此外,您已多次包含多个版本的jquery。你真的不应该这样做,因为这可能会导致重大问题!

在HTML的头部,您有以下包含到jquery:

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>

在你的身体里,你有以下几点:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>   
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"> </script>

理想情况下,您应该删除头部中的包含,并且仅在底部使用包含 你的身体最终,您希望身体尽可能低:

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js">

我已使用这些更改更新了您的 JSFiddle ,您现在可以看到它有效。

相关问题