jquery - Textarea自动调整到内容高度jQuery

Question

问题是，当文本区域的高度高于窗口时，滚动会粘在文本区域的顶部，而它应该集中在插入符号所在的位置。

这是我的代码

function adaptiveheight(a) {
    $(a).height(0);
    var scrollval = $(a)[0].scrollHeight;
    $(a).height(scrollval);
}

这是一个小提琴

尝试使 textarea 冗长，你会发现问题。

尽可能我不想要第三方插件。谢谢

Answer 1

在adaptiveheight(a)函数末尾添加此代码

if (parseInt(a.style.height) > $(window).height() - 30) {
        $(document).scrollTop(parseInt(a.style.height));
    }

工作演示http://jsfiddle.net/cse_tushar/ve4rL/3/

新的js代码

$("#description").keyup(function (e) {
    adaptiveheight(this);
});
i=0;
j=0;
function adaptiveheight(a) {
    $(a).height(0);
    var scrollval = $(a)[0].scrollHeight;
    $(a).height(scrollval);
    if (parseInt(a.style.height) > $(window).height()) {
        if(j==0){
            max=a.selectionEnd;
        }
        j++;
        var i =a.selectionEnd;
        console.log(i);
        if(i >=max){
            $(document).scrollTop(parseInt(a.style.height));
        }else{
            $(document).scrollTop(0);
        }
    }
}

工作演示http://jsfiddle.net/cse_tushar/ve4rL/5/

Answer 2

调整 textarea 的大小后，您可以简单地保持当前页面位置：

function adaptiveheight(a) {
    var $a = $(a), $window = $(window), scrollTop = $window.scrollTop();
    $a.height(0).height($a.prop('scrollHeight'));
    $window.scrollTop(scrollTop);
}

请参阅https://github.com/jgonera/micro.js/blob/master/micro.autosize.js。