자동 높이 텍스트 영역
텍스트 영역으로 작업할 때 흔히 발생하는 문제 중 하나는 텍스트 영역을 사용하지 않고도 사용자의 입력을 수용할 수 있도록 높이를 조정하는 것입니다. 스크롤바. 이러한 우려는 텍스트 영역의 콘텐츠 길이가 종종 달라지는 시나리오에서 발생합니다. 순수 JavaScript를 사용하여 이를 달성할 수 있는 방법은 다음과 같습니다.
제공된 코드 조각은 콘텐츠에 따라 텍스트 영역의 높이를 동적으로 조정하는 auto_grow라는 JavaScript 함수를 활용합니다.
function auto_grow(element) {
element.style.height = "5px";
element.style.height = (element.scrollHeight) + "px";
}CSS에서, 다음 스타일을 정의하여 스크롤 막대를 제거하고 최소 및 최대 높이를 설정할 수 있습니다.
textarea {
resize: none;
overflow: hidden;
min-height: 50px;
max-height: 100px;
}이 기능을 구현하려면