JavaScript를 사용하여 텍스트 영역에 문자 제한 적용 HTML 양식으로 작업할 때 사용자가 텍스트 영역에 입력할 수 있는 문자 수를 제한하는 것이 중요한 경우가 많습니다. 요소는 maxlength 속성을 제공하지만 항상 이 기능을 구현하는 가장 편리한 방법은 아닙니다.</p> <h3>JavaScript로 maxlength 에뮬레이션</h3> <p>maxlength 속성을 수동으로 설정하는 대신 JavaScript를 활용하여 동일한 결과를 얻을 수 있습니다. 효과. 한 가지 접근 방식은 onkeypress 및 onkeyup과 같은 이벤트 핸들러를 사용하여 텍스트 영역 값의 길이를 모니터링하고 이에 따라 입력을 제한하는 것입니다. 그러나 이 방법을 사용하려면 각 텍스트 영역에 대해 이벤트 처리 코드를 반복해야 합니다.</p> <h3>자동 길이 적용</h3> <p>문자 제한 적용 프로세스를 자동화하려면 더 우아한 솔루션은 다음을 평가하는 JavaScript 코드를 사용하는 것입니다. 각 텍스트 영역 요소의 maxlength 속성을 동적으로 처리합니다. 이 접근 방식에는 다음 단계가 포함됩니다.</p> <ol> <li> <strong>텍스트 영역 식별</strong>: document.getElementsByTagName('TEXTAREA')를 사용하여 문서의 모든 텍스트 영역 목록을 검색합니다.</li> <li> <strong>maxlength 속성 확인</strong>: 각 텍스트 영역에 대해 유효한 값(0보다 큰 숫자)을 가진 maxlength 속성이 있는지 확인하세요.</li> <li> <strong>익명 함수 만들기 </strong>: 텍스트 영역의 길이를 확인하고 제한이 초과되면 경고를 표시하는 익명 함수를 정의합니다.</li> <li> <strong>이벤트 핸들러 할당</strong>: 익명 함수를 onkeyup 및 onblur 이벤트로 할당합니다. 텍스트 영역에 대한 핸들러. 이러한 이벤트는 사용자가 텍스트 영역을 입력하거나 종료할 때마다 트리거되어 길이 유효성 검사를 요청합니다.</li> </ol> <p>질문에 제공된 코드 예제는 이 접근 방식을 보여 주며 문서의 모든 텍스트 영역에 대해 maxlength 속성을 자동으로 적용합니다. . 이 기술을 사용하면 개발자는 반복적인 이벤트 처리 코드 없이 글자 수 제한을 적용할 수 있습니다.</p>
