HTML <textarea>의 최대 길이

Question

HTML에 입력할 수 있는 최대 문자 수를 제한하는 방법 <textarea>?크로스 브라우저 솔루션을 찾고 있습니다.

Answer 1

그만큼 TEXTAREA 태그에 MAXLENGTH 그 방식을 귀속시키다INPUT 태그는 적어도 대부분의 표준 브라우저에서는 그렇지 않습니다.문자 수를 제한하는 매우 간단하고 효과적인 방법입니다. 타이핑된 으로 TEXTAREA 태그는 다음과 같습니다:

<textarea onKeyPress="return ( this.value.length < 50 );"></textarea>

메모: onKeyPress, 버튼 누르기를 방지할 예정입니다. 아무 버튼이나 포함 백스페이스 키.

이것은 부울 표현식이 새로운 캐릭터가 원하는 최대 길이로 추가되기 전에 필드의 길이를 비교하기 때문에 (이 예에서 50, 여기에서 자신의 사용), 한 번 더 공간이 있으면 TRUE를 반환합니다. false 그렇지 않다면.대부분의 이벤트에서 false를 반환하면 기본 작업이 취소됩니다.따라서 현재 길이가 이미 50 (또는 그 이상)이면 핸들러는 False를 반환합니다. KeyPress 작업이 취소되고 캐릭터가 추가되지 않습니다.

연고의 한 파리는 TEXTAREA, 이는 원인이되지 않습니다 KeyPress 이벤트가 발생하여 이 확인을 우회합니다.Internet Explorer 5+에는 onPaste 핸들러에 수표를 포함 할 수있는 이벤트.그러나 클립 보드에서 얼마나 많은 캐릭터 수를 고려하여 총계가 한도를 인계 할 것인지 아닌지를 알아야합니다.다행히도, 즉, 창 객체의 클립 보드 객체도 포함되어 있습니다.1 따라서:

<textarea onKeyPress="return ( this.value.length < 50 );"
onPaste="return (( this.value.length +
window.clipboardData.getData('Text').length) < 50 );"></textarea>

다시 말하지만, onPaste 이벤트와 clipboardData 개체는 IE 5+에만 해당됩니다.크로스 브라우저 솔루션의 경우 다음을 사용해야 합니다. OnChange 또는 OnBlur 핸들러를 사용하여 길이를 확인하고 원하는 대로 처리합니다(값을 자동으로 자르고 사용자에게 알리는 등).불행히도 이는 발생하는 오류를 포착하지 못하고 사용자가 필드를 떠나려고 할 때만 발생하며 이는 그다지 친숙하지 않습니다.

원천

또한 페이지에 포함할 수 있는 완성된 스크립트를 포함하는 다른 방법도 있습니다.

http://cf-bill.blogspot.com/2005/05/textarea-maxlength-revisited.html

Answer 2

HTML5는 이제 허용합니다 maxlength 속성 <textarea>.

IE <= 9 및 iOS Safari 8.4를 제외한 모든 브라우저에서 지원됩니다.보다 caniuse.com의 지원 테이블.

Answer 3

$(function(){  
  $("#id").keypress(function() {  
    var maxlen = 100;
if ($(this).val().length > maxlen) {  
  return false;
}  
})
});  

참조 Html Textarea에서 최대 길이 설정