Bind a function to Twitter Bootstrap Modal Close
I am using the Twitter Bootstrap lib on a new project and I want for part of the page to refresh and retrieve the latest json data on modal close. I dont see this anywhere in the documentation can someone point it out to me or suggest a solution.
Two problems with using the documented methods
$('#my-modal').bind('hide', function () {
// do something ...
});
I attach a "hide" class to the modal already so it does not display on page load so that would load twice
even if I remove the hide class and set the element id to display:none and add console.log("THE MODAL CLOSED"); to the function above when I hit close nothing happens.
Bootstrap 3
$('#myModal').on('hidden.bs.modal', function () {
// do something…
})
See getbootstrap.com/javascript/#modals-events
Bootstrap 2.3.2
$('#myModal').on('hidden', function () {
// do something…
})
See getbootstrap.com/2.3.2/javascript.html#modals → Events
For Bootstrap v3.0, you just need to bind an event like this:
$('#my-modal').on('hidden.bs.modal', function () {
window.alert('hidden event fired!');
});
See the Modal Usage section of the docs here:
http://getbootstrap.com/javascript/#modals-usage
See this JsFiddle for a working example:
http://jsfiddle.net/kRLQ4/439/
Starting Bootstrap 3 ( edit: still the same in Bootstrap 4 ) there are 2 instances in which you can fire up events, being:
1. When modal "hide" event starts
$('#myModal').on('hide.bs.modal', function () {
console.log('Fired at start of hide event!');
});
2. When modal "hide" event finished
$('#myModal').on('hidden.bs.modal', function () {
console.log('Fired when hide event has finished!');
});
Ref: http://getbootstrap.com/javascript/#js-events
链接地址: http://www.djcxy.com/p/83954.html上一篇: 通过选择它以外的任何地方来隐藏div