Mehrere modale Dialogfeld Bildlaufleiste Bootstrap v.3.3.5 funktioniert nicht gut

Question

Ich erstellte mehrere modal dialog mit Bootstrap v.3.3.5. als ich die erste modal dialog startete, die Bildlaufleiste in der rechten funktioniert gut, aber nachdem ich die zweite modal dialog starten, und schließen Sie es, die Bildlaufleiste verschwindet.

In Bootstrap v.3.0.0 es kein Problem ist, wie Sie unten Demo sehen in kann

modal dialog with bootstrap v.3.0.0

Aber in Bootstrap v.3.3.5 es ein Problem existiert

modal dialog with bootstrap v.3.3.5

Answer 1

DEMO

Für ein Grund, warum es meine Klasse aus dem Körper entfernt und diese Bildlaufleiste verschwindet. Also hier ein netter Trick ist die enge Falle .modal und überprüfen zu erfassen, wenn eine .modal offen ist, und wenn ja fügen Sie die .modal-open Klasse body

$("#myModal2").on('hidden.bs.modal', function (event) { 
    if ($('.modal:visible').length) //check if any modal is open 
    { 
    $('body').addClass('modal-open');//add class to body 
    } 
}); 

Nun, wenn Sie ineinander mehrere Modalverben haben nisten, ersetzen Sie einfach $("#myModal2") mit $(document)

UPDATE

In letzter Zeit kam ich zu wissen, dass dies nur mit einer Linie mit reinem CSS getan werden kann, wie unten:

.modal{ 
    overflow:auto !important; 
} 

UPDATED DEMO

Answer 2

Sie eine Sache, fügen nur Ihre CSS folgendes:

#myModal{ 
overflow:auto !important; 
} 

Hoffe, es hilft !!

Answer 3

dynamisch hinzugefügt modals

$(document).on('hidden.bs.modal', '.modal', function() { 
    if ($('body').find('.modal.in').length > 0) { 
     $('body').addClass('modal-open'); 
    } 
}); 

Update für Bootstrap 4

$(document).on('hidden.bs.modal', '.modal', function() { 
    if ($('body').find('.modal.show').length > 0) { 
     $('body').addClass('modal-open'); 
    } 
});