如何滚动以自动滚动到可编辑 div onload 的底部答案

【问题标题】：How to scroll to automatically scroll to the bottom of an editable div onload如何滚动以自动滚动到可编辑 div onload 的底部
【发布时间】：2016-11-08 20:31:00
【问题描述】：

如何让可编辑的 div 记住滚动条的位置？我目前正在编写一个 Chrome 扩展程序，并且有一个记事本样式的可编辑 div，用户可以在其中写笔记。我目前列出了下面列出的代码，它自动聚焦 div 加载并在 div 内的文本末尾显示插入符号。

我现在只需要我的滚动条与插入符号一起滚动，如果它在 div 下方。

    var div = document.getElementById("edit_notepad");

div.onfocus = function() {
    window.setTimeout(function() {
        var sel, range;
        if (window.getSelection && document.createRange) {
            range = document.createRange();
            range.selectNodeContents(div);
            range.collapse(false);
            sel = window.getSelection();
            sel.removeAllRanges();
            sel.addRange(range);
        } else if (document.body.createTextRange) {
            range = document.body.createTextRange();
            range.moveToElementText(div);
            range.collapse(false);
            range.select();
        }
    }, 1);
};

div.focus();

【问题讨论】：

标签： javascript jquery html google-chrome google-chrome-extension

【解决方案1】：

您可能想尝试Scroll to bottom of Div on page load (jQuery) 中的不同方法，然后选择最适合您关注的方法。

一个建议的解决方案是按照@Mike Todd 的建议向下滚动到 div 的高度

正确版本：

$('#div1').scrollTop($('#div1')[0].scrollHeight);

这个相关的SO post 也可能有帮助。

【讨论】：

【解决方案2】：

你为什么不尝试一些简单的localStorage？

var position = localStorage.position || 0;
div.scrollTop = position;
localStorage.setItem("position", div.scrollTop);

据我所知，上面的代码应该获取并设置div滚动量的位置。

【讨论】：