Naudojau "JQuery UI's" dialogo langą ir jame buvo atidaryti
parinktis, kurioje galima nurodyti tam tikrą Javascript kodą, kuris bus vykdomas atidarius dialogo langą. Šią parinktį panaudočiau dialogo lange esančiam tekstui parinkti naudodamas turimą funkciją.
Dabar noriu tai padaryti naudodamas bootstrap's modal. Toliau pateikiamas HTMl kodas:
<div id="code" class="modal hide fade">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<pre>
print 'Hello World'
O dėl mygtuko, kuris atidaro modalinį langą:
<a href="#code" data-toggle="modal" class="btn code-dialog">Display code</a>
Bandžiau naudoti mygtuko "onclick" klausytoją, bet įspėjamasis pranešimas buvo rodomas prieš pasirodant modalui:
$( ".code-dialog" ).click(function(){
alert("I want this to appear after the modal has opened!");
});
Galite naudoti rodomas įvykis/parodyti įvykį pagal tai, ko jums reikia:
$( "#code" ).on('shown', function(){
alert("I want this to appear after the modal has opened!");
});
Demonstracinis pavyzdys: Plunker
Naudodami "Bootstrap 3.0" vis dar galite naudoti parodytą įvykį, tačiau jį naudotumėte taip:
$('#code').on('shown.bs.modal', function (e) {
// do something...
})
Žr. "Bootstrap 3.0" dokumentus čia skiltyje "Įvykiai".
neveiks.. vietoj to naudokite $(langas)
//PRIEŠ RODYMĄ
$(window).on('shown.bs.modal', function() {
$('#code').modal('show');
alert('shown');
});
//PRIEŠ PASLĖPTI
$(window).on('hidden.bs.modal', function() {
$('#code').modal('hide');
alert('hidden');
});