Question

问题在于，当textarea高度高于窗口时，当它应该聚焦到插入符号的位置时，滚动条会粘到textarea的顶部。

这是我的代码

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

这是fiddle

尝试让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。

Textarea自动调整到内容高度jQuery

2 个答案: