Bootstrap déroulant ne fonctionne pas
Je ne peux pas faire de bootstrap déroulant au travail.
Voici mon code html pour nav:
<ul class='nav'>
<li class='active'>Home</li>
<li class='dropdown'>
<a class="dropdown-toggle" data-toggle="dropdown" href='#'>Personal asset loans</a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">asds</a></li>
<li class="divider"></li>
</ul>
</li>
<li>Payday loans</li>
<li>About</li>
<li>Contact</li>
</ul>
Et voici les scripts:
<script type="text/javascript" src="js/bootstrap/bootstrap-dropdown.js"></script>
<script>
$(document).ready(function(){
$('.dropdown-toggle').dropdown()
});
</script>
Ce que je fais mal? Merci pour vos réponses!
- Vérifier ma réponse similaire à celui de l'affichage stackoverflow.com/questions/15592158/...
- Mon problème était le manque de bootstrap, js fichiers, dans le cas qui aide à quelqu'un d'autre
- J'avais mis à jour mon
Gruntfile.js
qui change de certains chemins dans lajsFileList
...mettre à Jour les chemins d'accès et de l'exécution de l'appropriées tâches Grunt (grunt dev / grunt build / etc) a résolu mon problème.
InformationsquelleAutor hjuster | 2012-09-17
Vous devez vous connecter pour publier un commentaire.
De travail de démonstration: http://codebins.com/bin/4ldqp73
essayer cette
J'ai eu le même problème. Après quelques heures de dépannage constaté que,
J'avais
au lieu de,
Espère que cela aide quelqu'un
J'ai eu le même problème quand j'ai inclus la
bootstrap.min.js
deux fois. Enlevé l'un d'entre eux et il a commencé à travailler.Pour info: Si vous avez bootstrap.js, vous devriez pas ajouter bootstrap-dropdown.js.
Je n'en suis pas sûr du résultat bootstrap.min.js.
bootstrap.js
etbootstrap.min.js.
. Quand j'ai enlevé le dernier, il fonctionne.js/bootstrap.js
ainsi quejs/dropdown.js
Pour votre style, vous devez inclure les fichiers css de bootstrap, généralement juste avant
</head>
élémentEnsuite, vous aurez besoin d'inclure les fichiers js, il est recommandé de les inclure à la fin du document, généralement avant la
</body>
afin que les pages se chargent plus rapidement.Ajouter les lignes suivantes dans le corps des balises.
vous devez importer ces fichiers dans le
<head></head>
de votre code html.Avez-vous inclus
jquery.js
?Aussi, de comparer cette ligne de code avec la vôtre:
Voir cette version qui fonctionne ok.
Les deux bootstrap et jquery doit être inclus:
NOTE: jquery-x.x.x.min.js version doit être à la version 2.x.x !!!
J'ai pensé à elle et de la façon la plus simple pour ce faire ist il suffit de copier et passé le CDN de bootstrap lien qui peut être trouvé dans https://www.bootstrapcdn.com/ et du Jquery CA Scripts qui peuvent être trouvés ici https://code.jquery.com/ et après tu copie le liens, le bootstrap liens coller sur la tête de l'HTML et le Script Jquery coller dans le corps de HTML comme dans l'exemple ci-dessous:
Pour moi fonctionne parfaitement, j'espère qu'elle travaille aussi pour vous 🙂
Essayer dans la section d'en-tête
Ici ce que j'ai fait est .....
Juste enlevé bootstrap.min.js à partir de mon Projet et a ajouté bootstrap.js et il a commencé à travailler........
Vous aurez à vérifier contradictoires fichiers css/propriétés par exemple, vous pourriez avoir ".nav" style personnalisé contenu ailleurs essayez de désactiver vos propres fichiers css et vérifier si cela fonctionne alors vérifier quels fichiers ou de style personnalisée qui rend les conflits
assurez-vous également que vous êtes, y compris la bootstrap.min.js dans votre code
J'ai eu un problème similaire, seulement de constater que j'avais ajouté le script bootstrap deux fois et le deuxième script bootstrap a été après ci-dessus le script jquery.
Solution:
J'ai eu le même problème qui m'a amené ici.
Mon Problème : j'ai été en utilisant le recommande jquery 1.12.0 version de mon script jquery fichier.
Solution : remplacer le script jquery jquery version 2.2.0.
Qui a résolu pour moi.
Pour moi, c'était une question de la SCRO. J'ai enlevé
crossorigin="anonymous"
de mon script d'importation des balises, et il a commencé à travailler à nouveau.BTW les dernières balises de script, dans le bon ordre, peuvent toujours être trouvés ici: https://getbootstrap.com/
Edit: Apparemment, l'ajout de
defer
à lascript
tag va également briser tous les Bootstrap goodies.Copier/coller le lien CSS suivie par la JS lien à partir du bootstrap site ici. Ensuite le menu déroulant devrait fonctionner.
Ma page ressemble à ceci:
(Barre de navigation de ici)