Question

我遇到了bootstrap模式的问题，我正在尝试做的是使用AJAX在bootstrap模式中插入HTML内容但是当我加载模态时没有显示任何内容，当我检查模态时我可以看到来自的html内容AJAX，我发现这是因为初始化模态所需的时间比AJAX加载html内容的时间更快。

有没有办法同时加载模态和AJAX，或者是否有另一种方法可以从模式体内的ajax显示中制作html内容。

模态：

<div class="modal hide fade" id="MobileAppPromoDiv">
<div class="modal-body">
</div>
<div class="modal-footer">
    <a href="#" class="btn btn-success" data-dismiss="modal">Ok</a>
</div>

Ajax：

$.get("URL",{action:21},function(htmlContent){
     $('#MobileAppPromoDiv').find('.modal-body').append(htmlContent);
                $('#MobileAppPromoDiv').modal('toggle');
});

Answer 1

我找到了一种在AJAX调用期间初始化模态的方法，因此两者将同时初始化并正确显示。

$.get("URL",{action:21},function(htmlContent){
 $('#MobileAppPromoDiv').find('.modal-body').append(htmlContent);
 $('#MobileAppPromoDiv').modal('show').on('shown', initHtml);
});

在initHTML函数中，我放置了我想要的html页面的初始化。 $(document).ready(function() { . . . }所以html页面将在模态初始化时准备就绪

我希望这会对某人有所帮助

Answer 2

你可以使用setTimeout（）方法延迟makel初始化一段时间，以便使用AJAX加载HTML内容。

Bootstrap Modal init和AJAX

2 个答案: