Sulge Bootstrap modaal

Mul on bootstrap modaalne dialoogiboks, mida ma tahan esialgu näidata, siis kui kasutaja klõpsab lehel, kaob see ära. Mul on järgmine:

$(function () {
   $('#modal').modal(toggle)
});

 <div class="modal" id='modal'>
     <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">Error:</h3>
        </div>
        <div class="modal-body">
        <p>Please correct the following errors:</p>
        </div>
     </div>
 </div>

Modaal kuvatakse algselt, kuid see ei sulgu, kui klõpsata väljaspool modaali. Samuti ei ole sisu ala halliks tõmmatud... Kuidas ma saan modaali algselt kuvada ja seejärel sulgeda pärast seda, kui kasutaja klikib väljaspool ala? Ja kuidas ma saan taustal hallisema, nagu demos?

Lahendus

Pane modal('toggle') asemel modal(toggle).

$(function () {
   $('#modal').modal('toggle');
});
Kommentaarid (6)

bootstrap modal sulgemiseks saate anda 'hide' valikuna modaalmeetodile järgmiselt.

$('#modal').modal('hide');

Palun vaadake töötavat [fiddle siin][2].

bootstrap pakub ka sündmusi, mida saab konksu modaal funktsionaalsusesse, näiteks kui soovite käivitada sündmuse, kui modaal on lõpetanud kasutaja eest varjamise, saate kasutada hidden.bs.modal sündmust, modaalide meetodite ja sündmuste kohta saate rohkem lugeda siit Dokumentatsioon.

Kui ükski ülaltoodud meetoditest ei toimi, siis anna oma sulgemisnupule id ja vallandage klõps sulgemisnupule.

Kommentaarid (2)

Minu viis senti selle kohta on see, et ma ei taha sihtida bootstrap modaal id ja nähes, et seal peaks olema ainult üks modaal korraga järgmine peaks olema täiesti piisav, et eemaldada modaal kui toggle võiks olla ohtlik:

$('.modal').removeClass('show');
Kommentaarid (1)