콘텐츠에 따라 줄어들고 커지는 자동 크기 조정 텍스트 영역을 어떻게 만들 수 있나요?

자동 크기 조정 텍스트 영역 생성

이전 토론에서 자동 크기 조정 텍스트 영역을 생성하는 방법이 제시되었습니다. 그러나 제한 사항이 남아 있습니다. 콘텐츠 삭제 시 텍스트 영역이 축소되지 않았습니다. 중요한 문제는 텍스트 영역 콘텐츠의 올바른 높이를 얻는 것입니다.

완전한 솔루션

다음 코드는 이전 코드에서 직면한 제한 사항을 해결하는 포괄적인 솔루션을 제공합니다. 방법:

$("textarea").each(function () {
  this.style.height = this.scrollHeight + "px";
  this.style.overflowY = "hidden";
}).on("input", function () {
  this.style.height = "auto";
  this.style.height = this.scrollHeight + "px";
});

장점:

• 키 입력 시 작동
• 붙여넣은 텍스트 지원(마우스 오른쪽 버튼 클릭 및 Ctrl v)
• 잘린 텍스트 처리(마우스 오른쪽 버튼 클릭 및 Ctrl x)
• 미리 로드된 텍스트 수용
• 사이트 전체의 모든 텍스트 영역(여러 줄 텍스트 상자)에 적용
• Firefox, Chrome, IE, Edge, iOS Safari 및 Android 브라우저
• 엄격한 JavaScript 모드 준수

구현:

1. 마스터 스크립트 파일에 jQuery 라이브러리를 포함합니다.
2. JavaScript 코드 조각을 마스터 스크립트 파일.
3. 이제 자체 조정 텍스트 영역을 다음에서 사용할 수 있습니다. 웹사이트에서 사용하세요.

이제 향상된 코드를 통해 텍스트 영역의 크기를 쉽게 자동으로 조정할 수 있어 다양한 플랫폼과 브라우저에서 사용자 친화적이고 일관된 경험을 제공할 수 있습니다.

위 내용은 콘텐츠에 따라 줄어들고 커지는 자동 크기 조정 텍스트 영역을 어떻게 만들 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!