Twitter Bootstrap (3.0.0) Dropdown & PrototypeJS

J'ai une application que je travaille lentement pour convertir en jQuery & allait également utiliser Bootstrap. Toutefois, lorsque vous utilisez Bootstrap 3, après avoir cliqué sur la liste déroulante, le menu s'affiche correctement. Cependant, après avoir cliqué sur le menu ou "fermeture" du menu. Le bouton/lien disparaît complètement et ne réapparaît pas jusqu'à l'actualisation de la page.Twitter Bootstrap (3.0.0) Dropdown & PrototypeJS

Comme ceci: https://github.com/twbs/bootstrap/issues/8379

Le lien ci-dessus dit de contacter le groupe Google, mais je n'ai pas vu quoi que ce soit des demandes concernant ce dans le groupe.

Toute aide serait grandement appréciée!

Merci, -David

Donc, en utilisant @ les conseils de GeekNum88, si vous commentez ces lignes, le menu déroulant ouvrages, pas sûr que les effets totaux de celui-ci encore:

function clearMenus() { 
    $(backdrop).remove() 
    $(toggle).each(function (e) { 
    var $parent = getParent($(this)) 
    if (!$parent.hasClass('open')) return 
//  $parent.trigger(e = $.Event('hide.bs.dropdown')) 
//  if (e.isDefaultPrevented()) return 
    $parent.removeClass('open').trigger('hidden.bs.dropdown') 
    }) 
}

Source

2013-08-22 dcmoody

Par curiosité. Avez-vous essayé d'utiliser l'ancienne version de bootstrap? http://getbootstrap.com/2.3.2/ .. Si oui, obtenez-vous toujours le même résultat? –

Ceci est l'une de mes réponses pour une question similaire http://stackoverflow.com/questions/15087129/popover-hides-parent-element-if-used-with-prototype-js/15095654#15095654 –

Essayez d'utiliser ce bootstrap amical prototype.js comme il a fixé mes questions pour une question similaire: http://stackoverflow.com/questions/19139063/twitter-bootstrap-3-dropdown-menu-disappears-when-utilisé-avec-prototype-js – MWD

La mise en œuvre d'une baisse Bootstrap -down menu est une tâche très simple. Voir la example dans la documentation Bootstrap et procédez comme suit:

1. Inclure les bibliothèques suivantes entre les balises tête juste sous le titre tag

Assurez-vous que la bibliothèque jQuery obtient chargé avant la bibliothèque Boostrap JS.

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

2. Coller le code HTML suivant entre le corps balises

<div class="btn-group"> 
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
    Action <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" role="menu"> 
    <li><a href="#">Action</a></li> 
    <li><a href="#">Another action</a></li> 
    <li><a href="#">Something else here</a></li> 
    <li class="divider"></li> 
    <li><a href="#">Separated link</a></li> 
    </ul> 
</div>

de travail Exemple:

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Bootstrap Dropdown</title> 

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 

</head> 

<body> 
    <div class="btn-group"> 
     <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
     Action <span class="caret"></span> 
     </button> 
     <ul class="dropdown-menu" role="menu"> 
     <li><a href="#">Action</a></li> 
     <li><a href="#">Another action</a></li> 
     <li><a href="#">Something else here</a></li> 
     <li class="divider"></li> 
     <li><a href="#">Separated link</a></li> 
     </ul> 
    </div> 
</body> 
</html>

Pour prouver qu'il fonctionne, voirthe fiddle.

Source

2014-03-07 09:41:13 Eugene

Avez-vous même * lire * la question? – dashard

Twitter Bootstrap (3.0.0) Dropdown & PrototypeJS

Répondre

Questions connexes