textarea输入框实时统计输入字符数

最新推荐文章于 2022-09-08 18:47:44 发布

weixin_30377461

最新推荐文章于 2022-09-08 18:47:44 发布

阅读量714

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/wush-1215/p/9279931.html

 1 <!DOCTYPE html>
 2 <html>
 3 
 4     <head>
 5         <meta charset="UTF-8">
 6         <title></title>
 7         <style type="text/css">
 8             #num {
 9                 color: red;
10             }
11         </style>
12     </head>
13 
14     <body>
15 
16         <textarea class="weui_textarea" onkeyup="wordStatic(this);" maxlength="50" id="studyIdea" placeholder="请填写您的培训收获！" rows="3"></textarea>
17         <div class="weui_textarea_counter"><span id="num">0</span>/50</div>
18 
19     </body>
20     <script type="text/javascript">
21         function wordStatic(input) {
22             // 获取要显示已经输入字数文本框对象
23             var content = document.getElementById('num');
24             if(content && input) {
25                 // 获取输入框输入内容长度并更新到界面
26                 var value = input.value;
27                 // 将换行符不计算为单词数
28                 value = value.replace(/\n|\r/gi, "");
29                 // 更新计数
30                 content.innerText = value.length;
31             }
32         }
33     </script>
34 
35 </html>