文本框textarea实时提示还可以输入多少文字

 我来答

1个回答

匿名用户
2016-02-23

展开全部

文本框 textarea 
限制输入文字个数的的javascript代码，我们经常在评论留言页面我们需要在客户端限制访客的留言长度，当然最好我们在服务器端也要加上相应的代码，因为客户端的限制是相对的。本文整理了3种限制输入字符数的方法：

方法一：文本框textarea限制输入文字个数为200个

<h3>设计理念说明（200字以内）</h3> 
<textarea onkeyup="checkLen(this)"></textarea> 
<div>您还可以输入 <span id="count">200</span> 个文字</div> 
  
<script type="text/javascript"> 
function checkLen(obj)  
{ 
    var maxChars = 200;//最多字符数 
    if (obj.value.length > maxChars) 
    obj.value = obj.value.substring(0,maxChars); 
    var curr = maxChars - obj.value.length; 
    document.getElementByIdx_x("count").innerHTML = curr.toString(); 
} 
</script>
  [提示：你可先修改部分代码，再按运行]

方法二：显示已经用字数和剩余字数

<script>
function cal() {
        if(a.value.length>20) {
                a.value=a.value.slice(0,20);
                b.value=20;
                c.value=0;
                }
        else {
                b.value=a.value.length;
                c.value=20-eval_r(b.value);
                }
        }
</script>
<textarea id="a" onpropertychange="cal()"></textarea>
已有字数：<input id=b size=5 value="0" disabled>
剩余字数：<input id=c size=5 value="20" disabled><br>
  [提示：你可先修改部分代码，再按运行]

方法三：支持双字节

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> 文本框textarea限制输入文字个数的方法 - 中国asp之家</TITLE>
 </HEAD>
 <BODY>
        <textarea onkeyup="cls(this,50,'v')" oncontextmenu="cls(this,50,'v')"></textarea>
        <span id="v"></span>
        <script type="text/javascript">
                function cls(obj,max,v){
                        var reg=/[^x00-xff]/gm;
                        var str=obj.value.replace(reg,'aa');//全换成单字节字符计算
                        var v=document.getElementByIdx_x('v');
                        
                        if(str.length>max){
                                var n=0,strr=[];
                                for(var i=0;i<obj.value.length;i++){//得到50字节以内的字符
                                        /[^x00-xff]/.test(obj.value.charAt(i))?n+=2:n+=1;
                                        if(n>max)break;
                                        strr.push(obj.value.charAt(i));
                                }
                                obj.value=strr.join('');
                                v.innerHTML=0;
                        }else{
                                v.innerHTML=max-str.length;
                        }
                }
        </script>
 </BODY>
</HTML>
  [提示：你可先修改部分代码，再按运行]


本回答被网友采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起