bootstrap 3 上未调用模态

Question

我有以下代码：

<div class="btn slick-slide slick-active" data-toggle="modal" data-target="#photo-carousel-modal" data-slick-index="0" aria-hidden="false" style="width: 234px;">
    <img class="img-holder img-thumbnail" src="image/path.jpg">
</div>

这里应该调用这个模式：

 <div class="modal fade bs-example-modal-lg" id="photo-carousel-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            {{-- Modal's content --}}
        </div>
    </div>
</div>

它根本不会触发任何东西！我是不是做了什么蠢事却没有意识到？

P.S.: 是的！ Bootstrap 确实可以正常工作。我在代码的其他部分使用了它，效果非常好！

Answer 1

确保您的 bootstrap.js 文件在您的 jQuery 文件之后被调用，如下所示：

<script src="path/to/jquery-file.js"></script>
<script src="path/to/bootstrap.js"></script>

（此外，删除任何其他 bootstrap js 文件，如 bootstrap-modal.js 等，因为 bootstrap.js 已经包含所有内容）

如果上述操作已经完成但仍未显示，请 post 根据您的问题 <head....</head 和网页页脚中的代码。

P.S. 检查浏览器控制台是否有错误，以便更好地了解正在发生的事情。

Answer 2

我后来发现我的代码有 3 个调用 jQuery 库。其中之一是在 bootstrap 电话之后。这就是我搞砸的地方！

（事实上，是另一个人在这里工作。）

所以，孩子们：不要在 BOOTSTRAP 电话之后再拨打 JQUERY 电话！它会让你发疯！

bootstrap 3 上未调用模态

Modal not being called on bootstrap 3

html

javascript

jquery

bootstrap-modal

twitter-bootstrap-3