jquery函数为bootstrap模式执行多次

Question

$(document).on('click', '.event_class', function() {

    $('#originalImageShow').modal('show');

    $('#originalImageShow').on('shown.bs.modal',  function() {
        alert('Modal Open');
    });
    $('#originalImageShow').on('hidden.bs.modal', function() {
        alert('Modal Close');
        $('#originalImageShow').off();
        $(this).removeData('bs.modal');
    });

});

您好， 每次我点击event_class它会显示两次“模态打开”警报。甚至有时它会显示多次。而且当我关闭Bootstrap Modal时，它有时会多次显示“模态关闭”警报。 基本上警报号码的数量随机变化。 请帮忙。

Answer 1

这是因为您在点击功能中添加 shown.bs.modal ，每次创建模态时都会绑定事件！

查看以下代码

<form action="index.php?controller=AdminModuleController">

$('.launchConfirm').on('click', function (e) {
    $('#confirm')
        .modal({ backdrop: 'static', keyboard: false })
        
});

$('.modal').on('shown.bs.modal',  function() {
        alert('Modal Open');
    });

$('.modal').on('hidden.bs.modal', function() {
        alert('Modal Close');
    });

body,
.modal-open .page-container,
.modal-open .page-container .navbar-fixed-top,
.modal-open .modal-container {
	overflow-y: scroll;
}

@media (max-width: 979px) {
	.modal-open .page-container .navbar-fixed-top{
		overflow-y: visible;
	}
}