在bootstrap模式显示之前绑定事件

Question

我有一个简单的bootstrap模式

<div id="mymodal" class="modal fade">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
    ...
    <div>
</div>

我使用数据切换

附加了一个按钮

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#mymodal"> Toggle</button>

现在，当点击按钮时，模态将显示出来。模态体包含一个需要预先填充的div。我使用下面的代码来做同样的事情

$('#mymodal').on('shown.bs.modal', function(){
    generate_modal_body();    
})

但上面的代码不起作用。令人惊讶的是，如果我在模态按钮上添加click事件，它可以触发generate_modal_body（）。 我在这里检查过类似的问题，但找不到满意的答案。 如果我遗漏了一些明显的东西，请告诉我。

Answer 1

请在文档就绪函数中附加显示的bootstrap模式事件。

<script type="text/javascript">
 $(document).ready(function () {
    $('#mymodal').on('shown.bs.modal', function() { 
       generate_modal_body();
    }) ;
 });
</script>

Answer 2

您必须使用正确的modal event：

Answer 3

请试试这个

function openModal() {
      $('#mymodal').modal('show');
    }