javascript - 如何制作一个只读的适合其内容

Question

我的表单中有一个文本区域：

<s:textarea key = "appInfo.collection" 
       required = "true" 
       readonly = "true"
       cssClass = "form-control" 
           rows = "8"/>

以及更多的文本区域字段。我想让这些文本区域在只读模式下适合它们的内容。

由于我已经指定rows=8，如果内容仅填充 2 行，它有时会显示一个空白区域，或者如果内容超过 8 行，它会显示一个滚动条。

如何在没有滚动条的情况下根据它们的内容为这些文本区域提供正确的大小？

Answer 1

您可以使用我评论中链接的答案。

关于你的评论

我的文本区域处于阅读模式，我没有可用的 keyup 功能

您不需要任何keyup处理程序：因为它是只读的，所以在页面加载后执行一次：

<s:textarea id = "myTextarea"
           key = "appInfo.collection" 
      required = "true" 
      readonly = "true"
      cssClass = "form-control" 
          rows = "8"/>

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);
}

$(function(){ 
    // call the function in document.ready 
    autoheight($("#myTextarea"));
});