Question

我的Bootstrap模式已成功显示，但show.bs.modal事件由于某种原因未被触发。

这是我的模态标记：

<div class="modal" tabindex="-1" id="email-modal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <p>hi</p>
            </div>
        </div>
    </div>
</div>

这是我的JavaScript：

$('#email-modal').on('show-bs-modal', function (event) {

        alert('hello, world!');

});
 $('#email-modal').modal();

fiddler

Answer 1

这是一个简单的错字：

FROM： show-bs-modal TO： show.bs.modal

$('#email-modal').on('show.bs.modal', function (event) {

    console.log('hello, world!');

});
$('#email-modal').modal();

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<div class="modal" tabindex="-1" id="email-modal">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
                <h4 class="modal-title"></h4>
            </div>
            <div class="modal-body">
                <p>hi</p>
            </div>
        </div>
    </div>
</div>

模态显示但show.bs.modal未触发

1 个答案: