解散模态引导程序后的操作

Question

I have this function to create my modal:

function modalAlert(text)
{
    if($('#modalToRemove'))
        $('#modalToRemove').remove();
    $('<div id="modalToRemove" class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button><h4 class="modal-title">TITLE</h4></div><div class="modal-body"><h4>'+text+'</h4></div><div class="modal-footer"> <a class="btn btn-default" data-dismiss="modal">Close</a></div></div></div></div>').modal();
}

And I would like to do an action after closing the modal. I tried this code but not working...

$('#myModal').on('hidden.bs.modal', function () {
  // do something…
})

Can you suggest me any thing else?

Thanks!!

Answer 1

Are you binding it after you add the element to the page?

 function modalAlert (text) { $('#modalToRemove').remove(); $('<div id="modalToRemove" class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button><h4 class="modal-title">TITLE</h4></div><div class="modal-body"><h4>'+text+'</h4></div><div class="modal-footer"> <a class="btn btn-default" data-dismiss="modal">Close</a></div></div></div></div>').modal(); $('#modalToRemove').on('hidden.bs.modal', function () { alert("xxx"); }); } modalAlert("hey"); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 

---

If you are binding the event outside of it, you need to use event delegation

$(document).on('hidden.bs.modal', '#modalToRemove', function () {
    alert("xxx");
});