TextArea元素 - 适合内容的默认大小

时间:2013-04-11 17:59:19

标签: jquery html css

如果我在textarea元素上设置固定宽度,是否有一种优雅的方法可将高度默认设置为允许其所有内容适合的大小?

我希望避免使用jquery中的任何硬编码来比较text.length并尝试将值等同于高度,但也许这是唯一的方法,我希望看到一些本机css规则,如果可能的话但我似乎无法想到任何一个问题。

我创造了一个小提琴,说明了我想要完成的事情。 http://jsfiddle.net/edZgm/

这是代码:

CSS:

textarea {
    overflow: hidden;
}

JQuery:

$('document').ready(function () {
    $('textarea')
        .width(500);

    //I have a width set, but see how the height defaults to a rediculously small amount.
    //I'd like to have the height default to fit everything on load.

});

HTML:

<textarea> ... lots of text </textarea>

提前谢谢。

2 个答案:

答案 0 :(得分:3)

有这个jQuery插件,Autosize。
http://www.jacklmoore.com/autosize/

这是您使用该插件更新的小提琴。
http://jsfiddle.net/edZgm/3/

刚加载插件并将其添加到您的代码中。

    $('textarea')
    .autosize();

答案 1 :(得分:3)

将评论作为未来参考的答案:

结帐jquery-autogrow