html已输入字数,通过jQuery设置textarea标签字数限制并实时计算已输入的字符数

在用HTML制作网页时,遇到 textarea 文本框标签时有时需要对文字内容长度设置固定输入字符数。本文主要介绍通过使用 jQuery 动态控制 textarea 文本框标签的内容和长度,对其输入的文字字符数及汉字数限制提示代码,并且,动态实时计算显示已经输入多少字符数的解决方法。

jQuery设置textarea标签字数限制代码并动态显示已输入的字符数

//显示限制输入字符method

function textAreaChange(obj){

var $this = $(obj);

var count_total = $this.next().children('span').text();

var count_input = $this.next().children('em');

var area_val = $this.val();

if(area_val.len()>count_total){

area_val = autoAddEllipsis(area_val,count_total);//根据字节截图内容

$this.val(area_val);

count_input.text(0);//显示可输入数

}else{

count_input.text(count_total - area_val.len());//显示可输入数

}

}

//得到字符串的字节长度

String.prototype.len = function(){

return this.replace(/[^\x00-\xff]/g, "xx").length;

};

/*

* 处理过长的字符串,截取并添加省略号

* 注:半角长度为1,全角长度为2

* pStr:字符串

* pLen:截取长度

* return: 截取后的字符串

*/

function autoAddEllipsis(pStr, pLen) {

var _ret = cutString(pStr, pLen);

var _cutFlag = _ret.cutflag;

var _cutStringn = _ret.cutstring;

return _cutStringn;

}

/*

* 取得指定长度的字符串

* 注:半角长度为1,全角长度为2

* pStr:字符串

* pLen:截取长度

* return: 截取后的字符串

*/

function cutString(pStr, pLen) {

// 原字符串长度

var _strLen = pStr.length;

var _tmpCode;

var _cutString;

// 默认情况下,返回的字符串是原字符串的一部分

var _cutFlag = "1";

var _lenCount = 0;

var _ret = false;

if (_strLen <= pLen/2){_cutString = pStr;_ret = true;}

if (!_ret){

for (var i = 0; i < _strLen ; i++ ){

if (isFull(pStr.charAt(i))){_lenCount += 2;}

else {_lenCount += 1;}

if (_lenCount > pLen){_cutString = pStr.substring(0, i);_ret = true;break;}

else if(_lenCount == pLen){_cutString = pStr.substring(0, i + 1);_ret = true;break;}

}

}

if (!_ret){_cutString = pStr;_ret = true;}

if (_cutString.length == _strLen){_cutFlag = "0";}

return {"cutstring":_cutString, "cutflag":_cutFlag};

}

/*

* 判断是否为全角

*

* pChar:长度为1的字符串

* return: true:全角

* false:半角

*/

function isFull (pChar){

if((pChar.charCodeAt(0) > 128)){return true;}

else{return false;}

}

28e9540fe89df292e18a425fb941e227.png

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值