Question

我有一个生成列表的for循环，我希望滚动条在打开页面时从列表底部开始，但我似乎无法使其工作看到所有可用的解决方案后。这是我的代码：

HTML：

<div class="js-conversation" id="msg-list">
<div class="modal-body-scroller">
<ul class="media-list-conversation">
{% for msg in messages | sort(attribute='timestamp') %}
<li>
...list html...
</l>
{% endfor %}
</ul>
</div>
</div>

这是JAVASCRIPT：

var objDiv = document.getElementById("msg-list");
objDiv.scrollTop = objDiv.scrollHeight;

我试过移动id =＆＃34; msg-list＆＃34;周围，但它没有任何影响。任何帮助将不胜感激。

Answer 1

添加jquery，然后滚动到所需的元素。

<script
    src="https://code.jquery.com/jquery-1.12.4.min.js"
    integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
    crossorigin="anonymous"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('html,body').animate({
                scrollTop: $(".media-list-conversation").offset().top+$(".media-list-conversation").height()
                },
            'slow');
        })
    </script>

<强>更新

我创建了一个示例：https://jsfiddle.net/j1oqv7xf/。它有多个带有虚拟文本的div元素和一个带有红色边框的所需div。页面加载完成后，页面将滚动到所需的div底部。

使用Javascript滚动到列表底部

1 个答案: