textarea基于内容js或jquery设置高度 [英] textarea set height based on content js or jquery

问题描述

这是我的代码：（保持简单）

this is my code: (keep it simple)

<textarea style="height:100px;">
    $textareatext
</textarea>

• if $ textareatext 是1行长我希望textarea的高度符合
  
• ，如果它的3,5或10行...相同的话。


• if $textareatext is 1 line long I want the height of textarea to fit
• if its 3, 5 or 10 lines...same thing.

我遇到的问题是 100px 高度太大，但是如果我将它设置为 20px 并且有10行，那么textarea高度太小。
注意：值是通过mysql预加载的。所以我认为它应该计算线条，然后根据多少线条设置高度？
有什么建议？

The issue I am having is at 100px the height is too big, but if I set it to 20px and there are 10 lines then the textarea height is too small. NOTE: values are preloaded via mysql. so I think it should count the lines,then set the height based on how many lines ? Any suggestions?

我使用Javascript和jQuery，或者任何你会建议的。

I use Javascript and jQuery, or anything you would suggest.

谢谢。

推荐答案

它们都是jQuery插件。

These may help. They're both jQuery plugins.



• jQuery Elastic


• 灵活区


• 自动增长


• jQuery Elastic
• Flexible Area
• Autogrow

编辑

var $textArea = $("#textarea-container");

resizeTextArea($textArea);

$textArea.off("keyup.textarea").on("keyup.textarea", function() {
    resizeTextArea($(this));
});

function resizeTextArea($element) {
    $element.height($element[0].scrollHeight);
}​

这个答案由下面的FrançoisWahl提供。 strong>

This answer was provided by François Wahl, below.

这篇关于textarea基于内容js或jquery设置高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！