JSFiddle - React, Tailwind, and code Playground

by infous

HTML

<textarea >
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Provident inventore consequatur aspernatur totam eveniet, voluptatem voluptas sint, fuga voluptatum quidem quo a odit, officiis quae excepturi odio facilis reprehenderit, sunt!
</textarea>

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Provident inventore consequatur aspernatur totam eveniet, voluptatem voluptas sint, fuga voluptatum quidem quo a odit, officiis quae excepturi odio facilis reprehenderit, sunt!

CSS

textarea {
    resize: none;
    overflow: hidden;
}

JavaScript

function auto_grow(element) {
  console.log('AAA', element, element.scrollHeight)
  $(element).css('height', "5px");
  $(element).css('height', (element.scrollHeight)+"px");
}

$('textarea').on('input', function () {
console.log('AAA', 'input');
	auto_grow(this);
});