javascript - 展开/折叠文本区域问题

Question

我正在尝试创建一个可扩展的文本区域，仅当该框为空时，该区域才会折叠回其原始高度。如果它不为空，那么我希望文本区域保持扩展并根据需要增长(即，当用户输入更多文本时增长)。文本区域永远不应该隐藏输入的文本，也就是说，它永远不应该折叠到隐藏其任何内容的高度。

我把到目前为止所拥有的放在 fiddle 中

http://jsfiddle.net/np5y4esr/8/

这几乎是正确的，但又不完全正确。如果您在第一个 textarea 中输入足够的文本，使其展开超过 300px 高度，然后单击第二个 textarea，然后返回第一个，第一个将折叠在你。我不确定我做错了什么。

我的规则只是上面第一段中的那些。如果任何人都可以创建一个新的 fiddle 来实现此目的或修改我的 fiddle 以使其工作，我将不胜感激您的帮助。

编辑:是否可以设置文本区域的最大扩展高度？也就是说，它会随着用户键入而展开，但会停止在某个点(例如 400px)，在该点处它会像默认文本区域行为一样滚动？

Answer 1

尝试像这样修改'focus'方法:

$('textarea.expand').focus(function () {
    if($(this).val()==="" || $(this).height() < 100) {
         $(this).animate({ height: "100px" }, 300); 
    }

});

希望对你有帮助。