【问题标题】:Cant get Bootstrap modal.js to work无法让 Bootstrap modal.js 工作
【发布时间】:2011-11-28 17:29:05
【问题描述】:

编辑:请记住,这个答案是在 Bootstrap 2 发布之前提出的,因此与第一个版本相关

我正在尝试动态添加和显示带有 AJAX 内容的 Bootstrap 模态窗口,但是在查看了一个半小时的文档后,我不明白我需要将哪些类或属性添加到我的模态 div 以便它们可以使用模态 API。

现在我有这样的东西:

var $modalWindow = $('<div />', {
    class: 'modal fade static',
    style: "display: none;",
    text: "Test"
});

$('body').append($modalWindow);

$modalWindow.modal('show');

而且它不起作用......也许我很密集,但在调用 show 方法之前,我在文档上找不到任何关于如何设置我的模态窗口的信息。

编辑:修复它,显然 bootstrap-modal.js 需要 bootstrap-tipsy.js 和 bootstrap-popover.js,尽管文档中没有提到它。说真的,Bootstrap 的文档最差,特别是考虑到它的流行程度。

【问题讨论】:

    标签: javascript jquery twitter-bootstrap


    【解决方案1】:

    修复它,显然 bootstrap-modal.js 需要 bootstrap-tipsy.js 和 bootstrap-popover.js,尽管文档中没有提到它。说真的,Bootstrap 的文档最差,特别是考虑到它的流行程度。

    编辑:在否决这个答案之前,请考虑这是在 bootstrap 2 之前,正如另一位评论者所说,他遇到了完全相同的问题,并通过添加醉酒和 popover 来解决它。 Boostrap 2 比它的第一个版本 BTW 更好

    【讨论】:

    • 实际上,modal 不需要 twipsy 或 popover 才能正常工作。我使用它很好,只包括bootstrap-modal.js。您的模态模板可能有问题。我的看起来像这样(无法格式化):&lt;div id="modal-dialog" class="modal hide fade" style="display: none; " &gt; &lt;div class="modal-header" &gt;&lt;a href="#" class="close" &gt;×&lt;/a &gt; &lt;h3 &gt;Header&lt;/h3 &gt;&lt;/div &gt; &lt;div class="modal-body" &gt; &lt;p &gt; Body &lt;/p&gt; &lt;/div &gt; &lt;div class="modal-footer" &gt; &lt;a href="#" class="btn cancel info"&gt;Cancel&lt;/a &gt;&lt;a href="#" class="btn primary" &gt;Save&lt;/a &gt;&lt;/div &gt;&lt;/div &gt;
    • 我遇到了类似的问题,也有同样的解决方案。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-09-10
    • 2019-05-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多