So stellen Sie die minimale und maximale Zeichenlänge in einem Textfeld mit Javascript ein

Question

Wenn ich einen Text habe und ich dem Benutzer nur die Eingabe von Text zwischen 5 und 10 Zeichen erlauben möchte, wie mache ich das mit Javascipt?

Ich habe versucht mit mix und max Funktionen, aber sie funktionieren nur für numerische Daten.

Answer 1

Sie so etwas tun könnte:

`

function checkLength(){ 
    var textbox = document.getElementById("textbox"); 
    if(textbox.value.length <= 10 && textbox.value.length >= 5){ 
     alert("success"); 
    } 
    else{ 
     alert("make sure the input is between 5-10 characters long") 
    } 
} 
</script> 
<input type="text" id="textbox"></input> 
<input type="submit" name="textboxSubmit" onclick="checkLength()" /> 
` 

Answer 2

Sie müssen das Attribut maxlength für Eingabefelder verwenden, so etwas wie dies sollte es tun:

<input name="myTextInput" type="text" maxlength="5"></input> 

Answer 3

Sie kann "maxlength" -Attribut verwenden, um nicht mehr als x Zeichen & Validierung mit Javascript für minimale Länge zu erlauben.

siehe folgendes Beispiel: http://jsfiddle.net/nZ37J/

HTML

<form id="form_elem" action="/sdas" method="post"> 
    <input type="text" id="example" maxlength="10"></input> 
    <span id="error_msg" style="color:red"></span> 
    <input type="button" id="validate" value="validate"></input> 
</form> 

Javascript:

$("#validate").click(function(){ 
    var inputStr = $("#example").val(); 
    if(inputStr.length<5) 
     $("#error_msg").html("enter atleast 5 chars in the input box"); 
    else 
     $("#form_elem").submit();  
}) 

Answer 4

<input name="myTextInput" type="text" minlength="5" maxlength="10"></input> 

Dies würde den Trick tun, wenn Sie mit js zu Schwierigkeiten nicht wollen.

Answer 5

Ich habe ein bisschen eine Mischung aus den obigen Proben versucht, um es so einfach wie möglich zu machen und unnötige Warnungen zu vermeiden. Script:

function checkLength(){ 
    var textbox = document.getElementById("comment"); 
    if(textbox.value.length <= 500 && textbox.value.length >= 5){ 
     return true; 
    } 
    else{ 
     alert("Your comment is too short, please write more."); 
     return false; 
    } 
} 

in das Formularfeld Code wäre: onsubmit = "return checkLength();">

Und der Textbereich in der Form selbst:

<label for="comment">*Comment:</label> 
<textarea name="comment" id="comment" rows="4" cols="40" required="required"></textarea> 

hoffen, dass diese hilft!