Как установить минимальную и максимальную длину символа в текстовом поле с помощью javascript
Если у меня есть текст, и я хочу разрешить пользователю вводить текст длиной от 5 до 10 символов, как это сделать с помощью javascipt?
Я пробовал использовать mix
и max
функции, но они работают только для числовых данных.
5 ответов
вы можете сделать что-то вроде этого:
`
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()" />
`
вам нужно использовать атрибут maxlength для полей ввода, что-то вроде этого должно сделать это:
<input name="myTextInput" type="text" maxlength="5"></input>
вы можете использовать атрибут "maxlength", чтобы не разрешать более X символов и выполнять проверку с помощью javascript для минимальной длины.
см. этот пример: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();
})
Я сделал немного смеси образцов выше, пытаясь сделать его как можно проще и избежать ненужных предупреждений. Сценарий:
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;
}
}
код в поле формы будет: onsubmit= " return checkLength ();">
и текстовая область в самой форме:
<label for="comment">*Comment:</label>
<textarea name="comment" id="comment" rows="4" cols="40" required="required"></textarea>
надеюсь, что это помогает!
<input name="myTextInput" type="text" minlength="5" maxlength="10"></input>
это сделает трюк, если вы не хотите проблем с js.