Les listes déroulantes Bootstrap ne fonctionnent pas en tant qu'asp Fichiers d'inclusion

Question

J'utilise les inclusions côté serveur pour ma barre de navigation sur mon site Web. La barre de navigation bootstrap fonctionne très bien dans son propre fichier: la liste déroulante s'ouvre et se ferme sur le mobile, mais une fois que je l'ai ajoutée sur la page je l'ai activée(), la liste déroulante affichera et ne reviendra pas.

Je ne suis pas sûr de ce que je fais mal, ou si quelqu'un peut comprendre ce qui ne va pas.

Voici le code de la barre de navigation qui fonctionne correctement.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> 
<link href="../_css/main.css" rel="stylesheet" type="text/css"> 

<nav class="navbar navbar-default navbar-fixed-top"> 
<div class="container-fluid"> 
    <div class="navbar-header"> 
     <a class="navbar-brand" href="/index.asp">O<span>NE</span> HEALTH <small>Nebraska One Health Resource Portal</small></a> 

     <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> 
    <ul class="nav navbar-nav navbar-right collapse navbar-collapse"> 

     <li><a href="/health-resources.asp">Health Resources</a></li> 
     <li class="active"><a href="/around-the-globe.asp">Around the Globe</a></li> 

     <form class="navbar-form navbar-right search" role="search"> 
      <div class="input-group"> 
       <input type="text" class="form-control" placeholder="Search"> 
       <div class="input-group-btn"> 
        <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button> 
       </div> 
      </div> 
     </form> 

    </ul> 
</div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

Je voici où j'essayer d'inclure le fichier, où les listes déroulantes ne fonctionnent plus ....

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> 
<link href="../_css/main.css" rel="stylesheet" type="text/css"> 

<!-- NAVIGATION --> 
<!--#include virtual="/navigation/navigation.asp" --> 

    <div class="index-main"> 
    <div class="container"> 
     <div class="col-md-10 col-md-offset-1"> 
     <h1 style="text-align: center">One Health</h1> 
     <h4 style="text-align: center; line-height: 35px; font-weight: 300">One Health is a comprehensive approach to public health which recognizes that the health of the environment, animals (wild and domestic), and humans are interconnected. To have long-term success against diseases, we have to address all three areas because diseases in one group frequently spill over and affect the others. The Nebraska One Health Program is a grant-funded program to network, research, and educate producers, pest control operators, educators, public health officals, and other interested parties about addressing diseases in nature that affect humans and their animals.</h4> 
</div> 
</div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

Answer 1

téléchargez les fichiers et incluez-les localement sur votre page html et vérifiez une fois.