search

Home  >  Article  >  Web Front-end  >  How to dynamically prompt the number of words in the input box with JavaScript_javascript skills

How to dynamically prompt the number of words in the input box with JavaScript_javascript skills

WBOY
WBOYOriginal
2016-05-16 15:48:501406browse

The example in this article describes the method of dynamically prompting the input box to enter the number of words in JavaScript. Share it with everyone for your reference. The details are as follows:

There is a function like a small note in QQ space. As you enter many words in the text box, it will dynamically prompt you "how many words have been entered" and "how many more words can be entered". I think it is quite good. , so I try to do it myself, haha.

At first, I think many people’s first impression was to do it through onkeydown or onkeyup of js. Then they found that focus setInterval() blur could also be used to achieve the effect we needed, so I quickly used this method to write it roughly by myself. All of a sudden, the desired effect was achieved. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>IT技术网-JavaScript动态提示输入框输入字数</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
function $(obj){
return document.getElementById(obj);
}
function sp(){
var tex = $('te').value;
var nun =tex.length;
var spa = $('span');
spa.innerHTML = nun;
}
</script>
</head>
<body>
你已经输入了<span id='span'>0</span>字
<input value="" id="te" type="text" onfocus="ss=setInterval(sp,600)" onblur="clearInterval(ss)"/>
</body>
</html>

I hope this article will be helpful to everyone’s JavaScript programming design.

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：JavaScript method of calling client Java program_javascript skillsNext article：JavaScript method of calling client Java program_javascript skills

Related articles

See more