扩展文本区域高度

Question

I created this codes to make automatic expanding of textarea height when the text inside exceeded to height of the textarea but this only works in jsfiddle but when i run this in my project this doesnt work. 我创建此代码的目的是当内部文本超出textarea的高度时自动扩展textarea的高度，但这仅在jsfiddle中有效，但是在我的项目中运行时，此功能无效。 does anyone can help me? 有人可以帮助我吗？ Thanks. 谢谢。

  $("#ta").keyup(function (e) { autoheight(this); }); function autoheight(a) { if (!$(a).prop('scrollTop')) { do { var b = $(a).prop('scrollHeight'); var h = $(a).height(); $(a).height(h - 5); } while (b && (b != $(a).prop('scrollHeight'))); }; $(a).height($(a).prop('scrollHeight') + 20); } autoheight($("#ta"));

  #ta { width:250px; min-height:116px; max-height:300px; resize:none; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <textarea id="ta"></textarea>

Answer 1

If you are using jquery then you have to load Jquery library and add your code in the document ready or window load. 如果使用的是jquery，则必须加载Jquery库并将代码添加到文档就绪或窗口加载中。 Below is the updated code: 下面是更新的代码：

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<style>

#ta {
    width:250px;
    min-height:116px;
    max-height:300px;
    resize:none;
}

</style>

<script>
$(document).ready(function(){
$("#ta").keyup(function (e) {
    autoheight(this);
    console.log("log");
});
});

function autoheight(a) {
    if (!$(a).prop('scrollTop')) {
        do {
            var b = $(a).prop('scrollHeight');
            var h = $(a).height();
            $(a).height(h - 5);
        }
        while (b && (b != $(a).prop('scrollHeight')));
    };
    $(a).height($(a).prop('scrollHeight') + 20);
}

autoheight($("#ta"));
</script>

</head>
<body>

<textarea id="ta"></textarea>

</body>
</html>

Answer 2

It is working for me in IE 11 as well, try the below js fiddle link in IE - 它也适用于IE 11，请尝试以下IE中的js小提琴链接-

https://jsfiddle.net/wp3wvuj2/3/ https://jsfiddle.net/wp3wvuj2/3/

$(document).ready(function(){
$("#ta").keyup(function (e) {
autoheight(this);
console.log("log");
});
});

 function autoheight(a) {
if (!$(a).prop('scrollTop')) {
    do {
        var b = $(a).prop('scrollHeight');
        var h = $(a).height();
        $(a).height(h - 5);
    }
    while (b && (b != $(a).prop('scrollHeight')));
};
$(a).height($(a).prop('scrollHeight') + 20);
}

autoheight($("#ta"));

扩展文本区域高度

问题描述

2 个解决方案

解决方案1
2 2017-01-25 07:07:05

解决方案2
0 2017-01-25 08:20:59

扩展文本区域高度

问题描述

2 个解决方案

解决方案1 2 2017-01-25 07:07:05

解决方案2 0 2017-01-25 08:20:59

解决方案1
2 2017-01-25 07:07:05

解决方案2
0 2017-01-25 08:20:59