Bootstrap v3 - 打开模态窗口会强制页面向上滚动到顶部

Question

当我打开一个模态窗口时,它会将背景上下文一直滚动到顶部.示例我在页面底部有打开模态窗口的链接.当我点击链接时,窗口将向上滚动到文档的顶部,然后显示模态窗口.我对模态窗口的定位没有任何问题.我只是不希望在打开页面之前向上滚动.我主要使用来自BS v3的默认CSS(最新的github)和几乎默认的模态体.我正在使用JS填充模态的标签和正文然后打开它

<!-- Modal -->
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body" id="myModalBody"></div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

Answer 1

我有同样的问题.我有一个按钮调用javascript函数来打开模态:

<a href="#" onclick="myFunction(id)">open modal</a>

并将其更改为:

<a href="javascript:void(0)" onclick="myFunction(id)">open modal</a>

这解决了滚动到顶部的问题.

我正在使用bootstrap 3.3.7我相信.

Answer 2

我发现问题出在一些我用来强制滚动条的 CSS 上。这个 CSS 给了 body 100% 的高度。一旦我删除了它，模式就可以完美地工作，而无需滚动到顶部。