Bootstrap 3 modal не закрывается на внешний клик
Я создал модальный с помощью вызова,
$('#myModalContent').modal('show');
html это:
<div class=" modal fade" id="myModalContent" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
</div>
</div>
</div>
</div>
проблема в том, что когда я нажимаю вне модального всплывающего окна, он не закрывается. (его закрывается на esc)
5 ответов
Я написал пользовательский код для решения этой проблемы.
$("body").on("click", ".modal-dialog", function(e) {
if ($(e.target).hasClass('modal-dialog')) {
var hidePopup = $(e.target.parentElement).attr('id');
$('#' + hidePopup).modal('hide');
}
});
вы можете передать параметры в модальный as:
$('#myModal').modal({
show:true,
backdrop:true,
keyboard:true
})
It should work if you are using bootstrap 3
<div class="modal fade bs-example-modal-sm" id="modalExample" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
<h4 class="modal-title">Small Modal</h4>
</div>
<div class="modal-body">...</div>
</div>
</div>
</div>
и вызовите его как вызовите его как: $('#modalExample').modal();
//remove modal class from modal start div and
$('#MyModal').modal({ backdrop: false });
$('body').removeClass("modal-open");