Bootstrap 模态未出现，尽管包含所有文件且 HTML 显示正确

Question

这可能看起来重复，但我看到的所有其他答案都与错误包含脚本或错误分配 data-* 值有关。

我有一个非常简单的 bootstrap 模式（今天早上更新了 3.3.6 版），我这辈子都无法出现！在 MVC5 中工作，我有一个标准视图，我希望 bootstrap 模式出现在数据表中的按钮上。为了排除数据表本身，我把这个按钮去掉并把它贴在页面上。

按钮看起来像这样：

<a href="#" class="btn btn-primary edit-modal" data-target="#modal-container" data-trigger="modal">Edit</a>

我按顺序包括 jQuery v2.1.4（最小）和 bootstrap 3.3.6（最小）：

我从 Bootstrap 示例站点中获取了常用模态 HTML 片段，并对其进行了一些小改动：

<div id="modal-container" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="model-close-btn" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">Edit</h4>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary">Save</button>
            </div>
        </div>
    </div>
</div>

（我从输出 HTML 中提取了这两个 HTML 片段而不是 .cshtml 以防它们在输出时被 MVC / JS 摆弄）

我看不出此配置有任何问题，但无论我如何尝试，我都无法显示模态。

没有控制台错误 onload 或 onclick 并且页面呈现时隐藏了模式（所以我假设 BS 正在执行某些操作！）

jQuery 和 Bootstrap 的所有其他用法、样式和代码明智的工作，除了这个例外。

我尝试过的事情：

正在更新 BS 和 jQuery
四处移动模态 html（正文结束之前，正文开始之后，随机在中间！）
删除 data-* 标签并将点击绑定到按钮
正在更改模态的 id

我现在没主意了，如果没有错误，我就没有更多的想法可以调试了。

任何想法或什至模糊的领域都可以用来调查，这将非常有帮助。

Answer 1

你可以通过将 data-trigger="modal" 替换为 data-toggle="modal"[= 来更改锚标记吗12=]

<a href="#" class="btn btn-primary edit-modal" data-target="#modal-container" data-toggle="modal">Edit</a>

Answer 2

尝试 href="javascript:void(0)" 可能它认为您需要进行远程加载或将标签替换为按钮

Answer 3

试试这个

<a href="#" class="btn btn-primary edit-modal" data-target="#modal-container" data-toggle="modal">Edit</a>

Bootstrap 模态未出现，尽管包含所有文件且 HTML 显示正确

Bootstrap modal not appearing, despite all files included and HTML appearing correct

jquery

twitter-bootstrap

bootstrap-modal