js判断文本框剩余可输入字数

来源:互联网 发布:淘宝店铺装修 知乎 编辑:程序博客网 时间:2024/04/29 20:12

 

为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数

 

JS实现方法

 

<html><head runat="server">    <title></title>    <script type="text/javascript">         var maxstrlen = 160;        function Q(s) { return document.getElementById(s); }         function checkWord(c) {            len = maxstrlen;            var str = c.value;            myLen = getStrleng(str);            var wck = Q("wordCheck");             if (myLen > len * 2) {                c.value = str.substring(0, i + 1);            }            else {                wck.innerHTML = Math.floor((len * 2 - myLen) / 2);            }        }         function getStrleng(str) {            myLen = 0;            i = 0;            for (; (i < str.length) && (myLen <= maxstrlen * 2); i++) {                if (str.charCodeAt(i) > 0 && str.charCodeAt(i) < 128)                    myLen++;                else                    myLen += 2;            }            return myLen;        }        </script></head><body>    <form id="form1" runat="server">    <div style="font-size: 16px">        控制输入框字符输入,计算输入字符总数,显示剩余字数;<br>        一个英文字符算一个字符,一个中文字符算两个字符计算。    </div>    <div>        <textarea onkeyup="javascript:checkWord(this);" onmousedown="javascript:checkWord(this);"            name="content" style="overflow-y: scroll"></textarea>    </div>    <div>        还可以输入<span style="font-family: Georgia; font-size: 26px;" id="wordCheck">160</span>个字符    </div>    </form></body></html>


 

 

参考资料: js统计文本框剩余可输入字数     http://www.studyofnet.com/news/529.html

 

0 0
原创粉丝点击