如何设置文本框中写入的最小字数?

时间:2016-05-20 12:30:57

标签: javascript jquery html

我想设置一个文本框中写入的最小文本数。

通常我们使用html的min属性。但我不想要它。

任何人都可以帮助我使用JavaScript代码来检查文本框中写入的文本数量,如果它小于7且大于21,则会显示一个警告框。否则它不会

<input type="text" id="txt">
<input type="button" onClick="myFunction()">

的js

function myFunction() {
   .....
}

我只知道这么多 请帮忙

5 个答案:

答案 0 :(得分:3)

您可以使用HTML5的模式属性

This will set minimum characters required to 1 and max characters required 
to 15

<input type="text" id="txt" pattern="[a-z]{1,15}>

答案 1 :(得分:1)

function myFunction() {
 if ($('#txt').val().length < 21 && $('#txt').val().length > 7) alert("yez");
}

$('button').on('click', function() {
  myFunction()
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="txt">
<button>click</button>

这应该有用 - 它会检查#txt HTML元素中内容的长度。如果大于7且小于21,则会提醒yez

答案 2 :(得分:1)

我添加的片段只计算真实单词的数量&#39;空格被省略。

&#13;
&#13;
function wordCount(text) {
  totalCount = 0;
  words = text.split(' ')
  words.forEach(function(word) {
    if (word.length > 0) {
      totalCount++;
    }
  })
  
  return totalCount;
}

window.myFunction = function() {
 textarea = document.getElementById('txt');
 words = wordCount(textarea.value);
 if(words < 7 || words > 21) {
   alert('Wrong number of words');
 }
}
&#13;
<input type="text" id="txt">
<input type="button" onClick="myFunction()" value="Submit">
&#13;
&#13;
&#13;

答案 3 :(得分:1)

您可以在blur上触发事件,这意味着,当文本框失去焦点时

&#13;
&#13;
$(document).ready(function(){
	$('#text-box').blur(function(){
    	var value = $('#text-box').val();
        if(value.length < 7 || value.length > 21){
        	alert("Invalid length");
        }
    });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="text-box">
&#13;
&#13;
&#13;

答案 4 :(得分:1)

function validate(){

x=document.myForm
input=x.myInput.value
if (input.length>5){
    alert("The field cannot contain more than 5 characters!")
    return false
}else {
    return true
}

}