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文件被称为 AFTER 您的jQuery文件，如下所示：

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

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

如果上述内容已经完成且仍未显示，请在您的问题上发布您<head....</head和网页页脚的代码。

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

Answer 2

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

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

所以，孩子们：在BOOTSTRAP呼叫之后不要放置你的JQUERY呼叫！它会让你疯了！

在bootstrap 3上没有调用模态

2 个答案: