文本区域宽度自动调整大小

Question

当我在文本区域内写入时，我想使用最大宽度自动调整文本区域的宽度，就像这段代码对输入所做的那样。 http://jsbin.com/ahaxe 有可能吗？

Answer 1

你尝试过这些也许可以帮助你

http://www.jacklmoore.com/autosize

http://www.technoreply.com/autogrow-textarea-plugin/

Answer 2

演示：http://jsfiddle.net/buM6M/1/

html:

<textarea id="t1" style='min-width:100px;min-height: 100px'>

</textarea>

 <div id="d1" style='max-width:200px;min-height:20px;display: none'>

</div>

js代码：

  $("#t1").live({
keyup: function(e){

    $("#d1").text($(this).val());
    $(this).css("width", $("#d1").css("width"));
    $(this).css("height", $("#d1").css("height"));
}
});​

根据您的要求设置 div 和 textarea 的尺寸。

Answer 3

使用jquery自动增长插件。

下载autogrowtextarea.js并添加到脚本中

并在 head 中添加此 css：

#id_of_textarea
{
height:auto;
width:width_of_textarea_you_want
}


$(function() {
$('#id_of_textarea').autogrow();
});

避免滚动：

$('#id_of_textarea').css('overflow', 'hidden').autogrow()

Answer 4

我为此创建了一个包，希望可以提供一些帮助。

https://www.npmjs.com/package/react-textarea-auto-witdth-height