Presta atención porque en este post vas a encontrar el resultado que buscas.Este enunciado fue analizado por nuestros especialistas para asegurar la calidad y exactitud de nuestro post.
Solución:
Desde la sección de eventos del Orejadropdown
documentación:
hide.bs.dropdown
: este evento se activa inmediatamente cuando se llama al método de instancia oculta.
Para empezar, para evitar que se cierre el menú desplegable, podemos simplemente escuchar este evento y evitar que continúe regresando false
:
$('#myDropdown').on('hide.bs.dropdown', function ()
return false;
);
Para una solución completa, probablemente desee permitir que se cierre cuando se hace clic en el menú desplegable. tan solo Algo de tiempo querremos evitar que la caja se cierre.
Para ello estableceremos .data()
banderas en dos eventos más planteados por el menú desplegable:
shown.bs.dropdown
– Cuando se muestre, estableceremos.data('closable')
parafalse
click
– Al hacer clic, estableceremos.data('closable')
paratrue
Así, si el hide.bs.dropdown
evento fue planteado por un click
en el menú desplegable, permitiremos un cierre.
Demostración en vivo en jsFiddle
JavaScript
$('.dropdown.keep-open').on(
"shown.bs.dropdown": function() this.closable = false; ,
"click": function() this.closable = true; ,
"hide.bs.dropdown": function() return this.closable;
);
HTML(nota que he agregado la clase keep-open
al menú desplegable)
Los cambios de versión en algunas dependencias han causado que KyleMit y la mayoría de las otras soluciones ya no funcionen. Investigué un poco más y, por alguna razón, un click()
se envía cuando Bootstrap intenta y falla hide.bs.dropdown
seguida de otra llamada a hide.bs.dropdown
. Resolví este problema forzando el cierre click()
ocurrir en el botón en sí, no en todo el menú desplegable.
Demostración en vivo en Bootply
JavaScript
$('.keep-open').on(
"shown.bs.dropdown": function() $(this).attr('closable', false); ,
//"click": function() , // For some reason a click() is sent when Bootstrap tries and fails hide.bs.dropdown
"hide.bs.dropdown": function() return $(this).attr('closable') == 'true';
);
$('.keep-open').children().first().on(
"click": function()
$(this).parent().attr('closable', true );
)
HTML
Click the dropdown button
It will stay open unless clicked again to close
$('.dropdown.keep-open').on(
"shown.bs.dropdown": function() this.closable = true; ,
"click": function(e)
var target = $(e.target);
if(target.hasClass("btn-primary"))
this.closable = true;
else
this.closable = false;
,
"hide.bs.dropdown": function() return this.closable;
);
body
margin: 10px;
Click the dropdown button
It will stay open unless clicked again to close
About this SO Question: Keep dropdown menu open
Fork This Skeleton Here Bootrsap 3.0 Skeleton
Bootstrap Documentation: Dropdowns
Te mostramos las reseñas y valoraciones de los lectores
Te invitamos a avalar nuestra misión dejando un comentario y valorándolo te lo agradecemos.
¡Haz clic para puntuar esta entrada!(Votos: 3 Promedio: 4)
Utiliza Nuestro Buscador