javascript - 如果通过 ajax 加载，如何在 Bootstrap 中打开模式？

Question

我正在通过 Ajax 调用模态的 div。加载 div 及其模态后，按钮将不会打开模态。下面的代码是模式结构，它只是一个 plain modal from bootstrap , 这已经通过 ajax 加载:

<div class="ajax-loaded-item">
 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="myModalZ">Large modal</button>

 <div class="modal fade" id="myModalZ" tabindex="-1" role="dialog" aria-labelledby="myModalLabelZ" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h2 class="modal-title" id="myModalLabelS">Filter our work</h2>
            </div>
            <div class="modal-body">
                Content.....
            </div>
        </div>
    </div>
 </div>
</div>

如果我需要重新加载 bootstrap.js，其中模态 jQuery 是因为内容现在是通过 ajax 加载的，是否有一种 init 模态调用我可以在我之后做自己的 ajax 回调？

Answer 1

您可以使用 jQuery 打开模式:

$(document).ready(function(){
    $('button[data-target="myModalZ"]').click(function(){
        $('#myModalZ').modal('show');
    });
});

More Documentation is here .

已编辑:

$(document).ready(function(){
    $('button[data-target="myModalZ"]').click(function(){
        if($('#myModalZ').length){
           $('#myModalZ').modal('show');
        } else {
           alert('Your message');
        }
    });
});