日期:2014-05-16  浏览次数:20411 次

类似腾讯微博字数统计功能的js(区分英汉)
类似腾讯微博字数统计功能的js(区分英汉)
2011-12-07 14:33

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<title>显示输入剩余字数</title>
<script>
?? ?var maxstrlen = 140;

?? ?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>
?? ?<div style="font-size: 16px">
?? ??? ?控制输入框字符输入,计算输入字符总数,显示剩余字数;<br> 一个英文字符算一个字符,一个中文字符算两个字符计算。
?? ?</div>
?? ?<div>
?? ??? ?<textarea onKeyUp="javascript:checkWord(this);"
?? ??? ???? onKeyDown="javascript:checkWord(this);" name="content" id="content"
?? ??? ??? ?style="overflow-y: scroll"></textarea>
?? ?</div>
?? ?<DIV>
?? ??? ?还可以输入<span style="font-family: Georgia; font-size: 26px;"
?? ??? ??? ?id="wordCheck">140</span>个字符
?? ?</div>
</body>
</html>