Как сделать <s: textarea /> readonly подходящим для его содержимого

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