扩展文本框，需要边距或反页移动答案

【问题标题】：Expanding Textbox, Needs Margin or Counter Page Move扩展文本框，需要边距或反页移动
【发布时间】：2017-10-13 17:43:14
【问题描述】：

我有一个“很好”的扩展文本框。

我正在使用来自该线程的代码：CSS Textarea that expands as you type text 这是我正在使用的代码：

$('textarea').on('paste input', function () {
    if ($(this).outerHeight() > this.scrollHeight){
        $(this).height(1)
    }
    while ($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))){
        $(this).height($(this).height() + 1)
    }
});

1）我的问题是如果有很多commnets并且文本框靠近底部......实际类型行/区域太低。它实际上位于浏览器的底部边缘。所以第一个目标是让线条/区域/光标的类型最低，在边缘上方约 40 像素。

2) 另一个相关的问题是，即使我滚动回输入，按下键的那一刻页面滚动，结果：行/光标回到最底部。

我的一个想法是扩展文本框，但将页面向上移动一行以补偿文本框的扩展。每行一行。这可能吗？

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

解决了我的问题。我完全按照我的想法做了，并将窗口向下移动了一个字体行以补偿文本框的扩展。我的字体大小是 12px，所以我将窗口移动了 12px。结果代码是另外 1 行：

tbxComments.on('paste input', function () {
    if ($(this).outerHeight() > this.scrollHeight) {
        //alert('inside');
        $(this).height('64')
    }
    while ($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) {
        $(this).height($(this).height() + 1);
        **window.scrollBy(0, 12);**
    }
});

希望对其他人有所帮助！

【讨论】：