Frage Das Bootstrap-Dropdown wird geschlossen, wenn Sie darauf klicken


Ich lege ein Formular in ein Bootstrap-Dropdown-Menü, aber wenn ich auf eines der Felder im Formular klicke, verschwindet das Dropdown-Menü. Ich habe dieses Stück Code, aber ich weiß nicht, wo ich es hinstellen soll, um zu verhindern, dass das Dropdown verschwindet.

$(function test() {
  // Setup drop down menu
  $('.dropdown-toggle').dropdown();

  // Fix input element click problem
  $('.dropdown input, .dropdown label').click(function(e) {
    e.stopPropagation();
  });
});

Kann mir bitte jemand sagen, wo ich das hinstellen soll? Ich habe versucht, im Bootstrap-Dropdown, ich versuchte es innerhalb der HTML aber es funktioniert immer noch nicht.


75
2018-06-02 15:59


Ursprung


Antworten:


Verwenden Sie einfach dieses Beispiel. Diese Lösung funktioniert für mich.

<script type="text/javascript">
window.addEvent('domready',function() {    
   Element.prototype.hide = function() {
      $(function () { 
        // replace your tab id with myTab
        //<ul id="myTab" class="nav nav-tabs">
        $('#myTab li:eq(1) a').tab('show');
      });      
   };
});
</script>

Ich hoffe, es wird dir helfen. Vielen Dank.


4
2018-04-02 15:35



Sie können den Dropdown-Aufruf alle zusammen überspringen, das Bootstrap-Dropdown funktioniert ohne sie. Stellen Sie sicher, dass Sie das Skript korrekt umschließen. Sie können es in die Kopfzeile oder den Text Ihrer Seite einfügen, obwohl ich es persönlich bevorzuge, es in den Text Ihrer Seite einzufügen.

JS

<script type="text/javascript">
    $('.dropdown-menu input, .dropdown-menu label').click(function(e) {
        e.stopPropagation();
    });
</script>

123
2018-06-02 16:59



Die Zeit ist vergangen, seit die Antwort akzeptiert wurde. Wenn Sie jedoch das Dropdown-Fenster geöffnet lassen möchten, wenn es sich wie eine Art Dialog verhält, denke ich am besten:

$('.dropdown').dropdown().on("hide.bs.dropdown", function(e) {
            if ($.contains(dropdown, e.target)) {
                e.preventDefault();
            //or return false;
            }
        });

9
2018-03-18 08:18



Wenn Sie nicht mehr alle Dropdown-Menüs schließen möchten, fügen Sie einfach eine zusätzliche Klasse zu Ihrem ul-Block hinzu:

<ul class="dropdown-menu keep-open-on-click">

Und benutze diesen Code:

$(document).on('click', '.dropdown-menu', function(e) {
    if ($(this).hasClass('keep-open-on-click')) { e.stopPropagation(); }
});

9
2017-12-29 20:57



Sie müssen das Ereignis stoppen, um den DOM-Baum zu sprudeln:

$('.dropdown-menu').click(function(e) {
    e.stopPropagation();
});

event.stopPropagation verhindert, dass das Ereignis den Knoten erreicht, an dem es schließlich vom Bootstrap-Versteckmenü behandelt wird.


7
2017-12-24 11:02



Dies funktioniert für meine (seitliche Seitenleiste öffnet eine einfache Verbindung mit Bootstrap-Toggle)

$('.dropdown').find("a").not('.dropdown-toggle').on("click",function(e){
    e.stopImmediatePropagation();
});

5
2017-07-02 21:48



Danke für die obige Antwort, ich hatte das gleiche Problem mit Untermenüs in den Dropdown-Menüs. Mit der obigen Lösung konnte ich das Problem auch lösen.

$('.dropdown-menu .dropdown-submenu a[data-toggle="dropdown-submenu"]').click(function (e)
{                   
    e.stopPropagation();
});

4
2018-03-25 16:12