Bootstrap Modal ajax 内容，动画加载答案

【问题标题】：Bootstrap Modal ajax content, animation loadingBootstrap Modal ajax 内容，动画加载
【发布时间】：2016-11-03 11:21:32
【问题描述】：

我使用Bootstrap Modal是从另一个页面加载内容，数据太复杂（多查询/动态表单），所以打开modal时会有点卡住。

我想要一些动画或指示器来显示模态框尚未崩溃...请稍候。

我必须搜索并尝试多种方法但不起作用，在某些解决方案中，当模态加载时 .gif 也会卡住。我将此方法用于远程内容。 http://jsfiddle.net/cp67J/1994/

<!-- Link trigger modal -->
<a href="remote_content.php?id=1" data-toggle="modal" data-target="#myModal" >
    Launch Modal content 1
</a>
<a href="remote_content.php?id=2" data-toggle="modal" data-target="#myModal" >
    Launch Modal content 2
</a>

<!--MODAL SECTION-->
<div class="modal fade" id="myModal" role="basic" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                
            </div>
        </div>
    </div>
</div>

【问题讨论】：

请提供您的JS代码。尤其是 Ajax 代码
我只使用 jquery.min.js & bootstrap.min.js 来加载模态
我的意思是哪个js代码导致这个模态被打开？你在使用 Ajax 吗？
没什么，看这个jsfiddle的例子

标签： javascript jquery ajax twitter-bootstrap bootstrap-modal

【解决方案1】：

不知道引导模式是否支持这一点。但简单的解决方案是。

显示带有加载动画的正常模式。
在后台使用 ajax 加载您的内容。
用加载的数据替换加载器。

附：您还可以尝试使用 $.fn.load 并让 jQuery 为您执行 2. 和 3. 步骤。

【讨论】：