Почему высота прокрутки текстовой области иногда равна 0?

#javascript #html #jquery #css

#javascript #HTML #jquery #css

Вопрос:

Я хочу сбросить высоту текстовой области в соответствии с высотой содержимого внутри нее. Моя проблема в том, что scrollHeight иногда возвращается 0 . Они textareas делаются в ajax запросе на успех.

 $('.offer-simple').click(function(){ // .offer-simple is a bootstrap tab link
    $("#offer_table textarea").each(function () {
        let height = $(this).prop('scrollHeight')   3;
        console.log(height);//0
        $(this).css('height',height   'px');
    });
});
 

Другая вещь, которая очень странная, заключается в том, что я использую вкладки начальной загрузки, и когда я перезагружаю страницу, когда открыта текущая вкладка начальной загрузки, она дает идеальную высоту, но всякий раз, когда при перезагрузке страницы открывается другая вкладка начальной загрузки, а затем я возвращаюсь к тому tab , где на самом деле размещены текстовые области, тогдав этом случае это не дает идеального scrollHeight результата.
введите описание изображения здесь

Комментарии:

1. Ваш вопрос содержит противоречие. Сначала вы говорите: «Моя проблема в том, что scrollHeight всегда возвращается 0 .», Но позже вы говорите: «… тогда это дает идеальную высоту …». Что это?

2. Таким образом, единственный раз, когда высота текстовых областей установлена правильно, — это когда страница загружается в первый раз без запуска вашего фрагмента js?

3. @yiffyiffyiff Нет. Когда открывается вкладка, на которой размещаются текстовые области. Скрипт запускается каждый раз, потому что все содержимое создается в ajax success

4. Это может быть «особенностью» используемого вами браузера. Он просто не утруждает себя вычислением scrollHeight элемента, который не показан. Что вы могли бы попробовать, непосредственно перед получением scrollHeight , так это изменить какое-либо свойство текстовой области, которое заставило бы браузер пересчитывать scrollHeight . Например, изменение высоты шрифта или отступа.