방지 사용자

Question

나는이 트릭을 사용하여 그것이 textarea에 input 요소에서 maxlength 속성을 에뮬레이트 할 수 있다고 알고 : checkLenght의 사용하여

<textarea rows="5" cols="30" onkeydown="return checkLength(this)"></textarea> 

<script type="text/javascript"> 
var maxLength = 30; 

function checkLength(elem) { 
    if (elem.value.length == maxLength) { 
    return false; 
    } 
    return true; 
} 
</script> 

을 반환 값을 onkeydown 이벤트의 반환 값으로 사용하면 입력 한 문자가 나타나기 전에 이벤트 체인이 끊어 지므로 사용자가 구성된 제한을 초과하여 글을 쓰는 것을 효과적으로 방지 할 수 있습니다.

Prototype의 이벤트 옵저버를 사용하여 동일한 기술을 시도했지만 작동하지 않았습니다. 여기에 내가 뭘하려의 단순화 된 버전입니다 : 내가 false를 반환하여 이벤트 체인을 깰 수 없기 때문에

<textarea rows="5" cols="30" id="myTextArea"></textarea> 

<script type="text/javascript"> 
var maxLength = 30; 

function checkLength() { 
    if ($('myTextArea').value.length == maxLength)) { 
    return false; 
    } 
    return true; 
} 

document.observe('dom:loaded',function(){ 
    $('myTextArea').observe('keydown',checkLength); 
}); 
</script> 

분명히,이 작동하지 않습니다 (그리고 Event.stop() 만 정지하지 실행을 버블 링에서이 이벤트를 방지 할 수 있습니다 전부).

onkeyup 이벤트에서 텍스트 영역의 길이를 확인하고 제한을 초과하면 해당 값을 잘라서이 문제를 해결했습니다. 사용자가 텍스트가 나타나고 사라지는 것을 볼 수 있기 때문에 동일하지는 않습니다.

동일한 결과를 얻을 수있는 방법이 있습니까?

Answer 1

다른 답변 및 의견을 고려하십시오. 게시물 유효성을 확인하고 게시물을 승인하지 않는 것이 좋습니다.

는 그럼에도 불구하고 다음은

이

<textarea rows="5" cols="30" id="myTextArea"></textarea> 
<script type="text/javascript"> 
    var maxLength = 30; 
    Event.observe('myTextArea', 'keydown', function (event) { 
     if ($('myTextArea').value.length == maxLength) { 
      Event.stop(event); 
      return false; 
     } 
    }); 
</script> 

Answer 2

documentation은 Event#stop이 전파를 중지 함을 나타내며 과은 기본 동작을 방지합니다. 작동하지 않습니까?

또한 keydown/keyup에 바인딩해도 텍스트 영역에 많은 양의 텍스트를 붙여 넣을 수 있습니다.

Joel이 자신의 의견에서 말한 것처럼 사용자가 타이핑하지 못하도록하는 것이 좋은 생각이 아닐 수도 있습니다. 유효성 검사 + 경고를 넣는 것이 훨씬 낫습니다 (Stackoverflow의 주석 필드처럼).

Answer 3

사용하여 setInterval 주기적으로 텍스트 영역의 상태를 확인하기 위해 (이 이유를 확인하기 위해 방해 할 수 없습니다하지. 않습니다 오페라, FF와 IE에서와) 작동합니다 원하는 경우 텍스트를 자르십시오.

Answer 4

트림 그냥 문자를

가 텍스트 영역 채우기 왜 다음, 알고 중간 부분에 가서 입력이 시도, 좋은 해결책이 아니다

끔찍한 효과가 있습니다

: 입력 된 문자가 촬영을하고 그런 다음 텍스트가 다듬어 져 끝 텍스트가 손실됩니다. 그 전에 입력 "이 입력 된 무엇인가" "무엇"이 : "없음" 당신이 얻을 것이다 : "이것은 T하지 무엇인가"

최대 길이 = 21
값 (길이 = 21)

원하는 효과는 끝 문자를 무시하는 대신 새 입력 된 문자가 무시된다는 것입니다.

예제에서는 매우 짧습니다 ... 여러 줄의 텍스트 영역을 상상해보십시오 ...사용자는 끝이 삭제되는 것을 보지 않고 중간에 입력을 계속합니다.

maxlength가있는 입력 유형 = "텍스트"에서 같은 예제를 시도하면 한계에 도달하면 새로운 입력 된 문자가 무시됩니다. 커서가 텍스트의 시작, 중간 또는 끝에서 무시됩니다.