arranque modal desaparecen inmediatamente después de mostrar

Question

estoy usando el plugin de modal de rutina de carga en los carriles

El sitio web dice que puedo ganar la función sin escribir JavaScript.

que añadir la siguiente línea en mi HTML (en delgado):

div#makeDream.modal.hide.fade 
    div.modal-header 
     a.close data-dismiss='modal' 
     h3 Hello World!    
    div.modal-body 
    div.modal-footer 

a data-toggle='modal' data-target='#makeDream' Button 

Sin embargo, después de hacer clic en el Button. el modal aparece, ¡pero desaparece inmediatamente!

me encontré con el css de #makeDream tiene

display:none 

no lo hago de dónde viene

¿Puede alguien decirme cómo solucionarlo?

Answer 1

Tuve este problema y la solución fue s imple ... Estaba cargando tanto bootstrap.js Y bootstrap-modal.js.

bootstrap.js incluye de arranque-modal.js.

Solución: Quite bootstrap-modal.js desde su head y funcionará correctamente.

Answer 2

tratar de eliminar la clase "ocultar" en esta línea:

div#makeDream.modal.hide.fade 

para que diga lo siguiente:

div#makeDream.modal.fade 

También tenga en cuenta que dependiendo de la versión de Bootstrap que está usando, el botón para abrir el modal podría necesitar escribirse como (traducir a html delgado):

<a class="btn" data-toggle="modal" data-backdrop="true" data-keyboard="true" href="#makeDream">Open Modal</a> 

Answer 3

Si alguien está utilizando twitter bootstrap modal en un sitio móvil, existe una gran posibilidad de que esté utilizando jquerymobile. Si es así, probablemente te encuentres con este problema particular de arranque modal que desaparece sobre ti. Encontré que el problema era con una clase '.fadein' de jquerymobile que estaba anulando la clase '.fadein' de bootstrap que causaba que la ventana modal se ocultara.

Puede corregir esto a su manera. Mi enfoque, ya que no estaba realmente usando fade in desde jquery mobile, lo comenté y ¡Voila! el diálogo modal estaba de vuelta. Espero que esto ayude a alguien. :)

Answer 4

En mi caso, el problema de mostrar y desaparecer inmediatamente la ventana modal fue que llamé para alternar dos veces. En primer lugar, en la etiqueta en el archivo HTML, y luego cuando se fija controlador de eventos en el archivo JavaScript, así:

<a role="menuitem" tabindex="-1" href="#" data-toggle="modal" data-target="#myModal" id="deleteItemButton">Delete Item</a> 

$ultodoListDisplay.on("click", "#deleteItemButton", function(){ 
    $('#myModal').modal('toggle'); 
}); 

referencias al Bootstrap CDN y hojas de estilo eran correctas. Por lo tanto, defina el alternar de la ventana modal solo una vez.

Answer 5

debe agregar bootstrap-model.js en la parte inferior de la página web, un problema también, yo estaba tratando con otro complemento, podemos utilizar otro complemento también, pero antes de usarlo, piense en bootstrap-model.js .....

Answer 6

Tenía lo mismo problema, me incluyeron tanto bootstrap.js como bootstrap.min.js, luego eliminé uno de ellos y resolvió el problema

Answer 7

bootstrap.min.js causa este problema, eliminando el problema resuelve, en caso de que aún no lo haga 't trabajo utilizar

jQuery(document).on('click','#SendMail',function(){ 
jQuery("#fixerrormodal").modal('toggle'); 
}); 

esto ayudará a cabo

Answer 8

En mi caso, los modales funcionaban bien con los atributos, pero cuando se llamaba .modal ('mostrar') desde js, se ocultaba inmediatamente. El problema se resolvió cuando puse bootstrap.js en el pie de página, pero no sé por qué no funcionaba en el encabezado después de todas las declaraciones css y jquery.

Answer 9

Tuve el mismo problema, en la carga de la página, basado en la variable de sesión, estaba mostrando el modal, y desapareció, cuando usé $ ('# myModal'). Modal ('show'), Mi problema se resolvió mediante el método jQuery Trigger, en el enlace de conexión que se utiliza

$(window).load(function(){ $('#loginlink').trigger('click'); });

Answer 10

tuve este problema porque tenía dos ref de "arranque/min.js", uno con CDN ref y otro era de secuencias de comandos ref archivo, hacer comentarios a uno de los dos me dio algunos menús desplegables que no responde de todos mis menús desplegables

Acabo de ir a Nuget Packet Manager y actualizar el "jQuery Validar discreto para Bootstrap 3", se resolvió mi problema :-)

Answer 11

en mi caso yo estaba usando wordpress plugin "wp-jubhunt" y el tema "_tk" y ambos se cargaba bootstrap.js tan incapacitantes de arranque .js en plugin funcionó para mí.

Answer 12

En mi caso, tuve un botón que estaba llamando la modal ...

<asp:Button ID="btnSearch" runat="server" Width="100%" Text="Select 
Action" class="btn btn-info btn-sm" data-backdrop="static" 
data-toggle="modal" data-target="#myModalID"></asp:Button> 

he cambiado el botón para una etiqueta de ancla y funciona bien

<a href="#" ID="btnShowModal" class="btn btn-info btn-sm" 
data-backdrop="static" data-toggle="modal" style="width:100%;" 
data-target="#myModalID">Select Action</a> 

Esto fue después de que verifiqué que no estaba cargando archivos javascript bootstrap duplicados. Bootstrap.min.js o boostrap.js. Solo uno es suficiente.

Answer 13

Puede simplemente eliminar los atributos data-toggle="modal" y data-target="#myModalID" del botón o etiqueta de anclaje. Esto alterna el modal y usted ha importado bootstrap.min. js dos o más veces, ¡lo cual lo alterna!

En cambio, escribir un oyente onClick evento para el botón y activar manualmente el modal: $('#myModal').modal();