Question

我想把我从AJAX里面得到的html内容放在Modal Body中，我设法通过AJAX正确地获取html，当我检查模态体时，我看到html被插入但我在html体内看不到任何内容，我尝试使用CSS来获取身体，但没有任何效果。

AJAX代码：

$.get("{{[byt_app_root]}}/control/byt_general_manager.tcl",{action:21},function(htmlContent){
$('body').append('\
<div class="modal hide fade" id="MobileAppPromoDiv">\
<div class="modal-header">\
<a class="close" data-dismiss="modal">×</a>\
</div>\
<div class="modal-body">\
'+htmlContent+'\
</div>\
</div>');
});

当我想通过JS访问模态时： $("MobileAppPromoDiv").modal("toggle");

问题是模态是空的。

请建议，

Answer 1

试试这个

<div class="modal hide fade" id="MobileAppPromoDiv">
    <div class="modal-header">
        <a class="close" data-dismiss="modal">×</a>
    </div>
    <div class="modal-body">
    </div>
    <div class="modal-footer">
    </div>
</div>
<script type="text/javascript">
    $.get("{{[byt_app_root]}}/control/byt_general_manager.tcl", { action: 21 }, function (htmlContent) {
        $('#MobileAppPromoDiv').find('.modal-body').append(htmlContent);
        $('#MobileAppPromoDiv').modal('show');
    });
</script>

Answer 2

使用$('.modal-body')选择器。

如果你正在使用rails，比如

$('.modal-body').html('<%= escape_javascript( ... ) %>');

应该有效

使用AJAX填充Bootstrap模态体

2 个答案: