js统计输入文本框的字数(区分中文,英文)

今天有个项目,需要统计输入框text的字数,用于限制用户的输入,就自己尝试手动写了下。 大家可以看看下面的代码

这个是html代码:

<div class="form-group kb-input-content">
      <textarea  name="content" id="comment_content"  placeholder="你的经验很有价值,将会成为他人的参考~" ></textarea>
     	 <div id="kb-input-tip">
            <span class="input-number-tip">15~500个字</span>
        </div>
 </div>


最后下面的是js代码,记得导入jquery 插件

// 中文字符判断(计算字符数)
function getStrLength(str) { 
    var len = str.length; 
    var reLen = 0; 
    for (var i = 0; i < len; i++) {        
        if (str.charCodeAt(i)  >= 0  || str.charCodeAt(i) <= 128) { 
            // 全角    
            reLen += 1; 
        } else { 
            reLen+=2; 
        }
    } 
    return reLen;    
}

//计算字符数(200个字内,用于回复框)
function count_str(value,total_count){
	var len = getStrLength(value),
		count = "";
		count = total_count-len; 
	if(count < 0 ){
		count = -count;
		return '已经超过<span class="red">'+count+'</span>字';
	}else{
		if(len<15){
			count = 15-len;
			return '最少15字,还需要输入<span>'+count+'</span>字';
		}else{
			count = total_count-len;
			return '还可以输入<span>'+count+'</span>字';
		}
		
		
	}
}

  /* 文本区域字数检测 */
$("#comment_content").on("keyup mouseup",function(event){
    var count_html=count_str($(this).val(),500);
    $(".kb-input-content").find(".input-number-tip").html(count_html);
    var content=$(this).val();
    var content_len=getStrLength(content);
   if(content_len<15){
	$(".kb-input-content") .find(".input-number-tip").addClass("warm");
   }else{
	$(".kb-input-content") .find(".input-number-tip").removeClass("warm");
   }
});


本文永久地址:http://www.huanghaiping.com/article/60.html
本文出自 黄海平博客 ,转载时请注明出处及相应链接。

发表我的评论
  

网友最新评论 (0)

暂无评论
返回顶部