在 Twitter Bootstrap 中打开模式窗口时出现 URL 问题答案

【问题标题】：Issue with the URL when opening the modal window in Twitter Bootstrap在 Twitter Bootstrap 中打开模式窗口时出现 URL 问题
【发布时间】：2013-04-27 16:44:51
【问题描述】：

在 Twitter Bootstrap 文档中，可以找到 here，滚动到 Modal 部分 - 注意 - 滚动并且不要单击侧边栏以立即跳转到该部分。

现在，在 Live Demo 下（在 Modal 部分滚动更多内容），单击“Launch Demo Modal”按钮。现在，注意 URL - 它没有改变并且显示模式窗口。关闭它，URL 不再更改。

然而，我的应用程序的行为有所不同 - 它显示成功的 URL 和模式窗口的 id（在示例中，它将是 myModal）。因此，如果它是我的应用程序，URL 将是 twitter.github.io/bootstrap/javascript.html#myModal - 请注意 ID 附加到 URL 的末尾 - 但在 Twitter Bootstrap 文档中不会发生这种情况例子。知道为什么吗？

【问题讨论】：

标签： twitter-bootstrap modal-dialog

【解决方案1】：

您使用的是 bootstrap-modal.js 脚本吗？在“MODAL DATA-API”部分，e.preventDefault() 应该阻止浏览器导航到 a 标签中指定的 href。

【讨论】：

我正在使用bootstrap.js，据我所知包含所有插件。

【解决方案2】：

你必须在 bootstrap.js 之前包含 jQuery.js！！

并且不要使用简化形式的 html 编写脚本。（如 <script scr=""/> ）必须像 <script scr=""></script> 一样关闭它）

<!-- JQuery -->
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js'></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

<!-- BootStrap Link -->
<link rel="stylesheet" type="text/css" href="/linker/styles/vendor/bootstrap.css">
<script type="text/javascript" src="/linker/js/vendor/bootstrap.js"></script>

文件准备好后，您是否给$('#creative_attachment_popup').modal('show'); 打过电话？

$(function() {
    $('#creative_attachment_popup').modal('show');
});

【讨论】：