Input输入框限制中文字数，超过字数限制则无法输入
时间:2018-12-26 16:53 来源:网络
特效简介
我们知道input控件有一个maxlength属性可以控制输入字符的长度，但是，它并不会识别是汉字还是其他符号，所以输入maxlength个汉字显然是不符合要求的。
为了实现对带有汉字的输入框长度控制，参考各位大神的贴子，我总结了一下方案：
第一种：定义js方法：
<input style="width:258px;" type="text" value="限制10个汉字" onkeyup="checkLength(this, 20);" />
<script>
var checkLength = function(dom, maxLength){
var l = 0;
for(var i=0; i<dom.value.length; i++) {
if (/[\u4e00-\u9fa5]/.test(dom.value[i])) {
l+=2;
} else {
l++;
}
if (l > maxLength) {
dom.value = dom.value.substr(0,i);
break;
}
}
};
</script>
|
其中 /[\u4e00-\u9fa5]/ 为匹配汉字的正则。达到maxlength时候，输入输入字符将不会在显示。
第二种：
第二种：
<input style="width:258px;" name="title" type="text" id="title" value="限制10个汉字" maxlength="10" class="intxt" onfocus="inputAutoClear(this)"/>
<script>
$('#title').bind('input propertychange',function(){ //添加监听input值的改变事件
var tvalmum;
//统计input输入字段的长度
tvalnum = $(this).val().length;
//如果大于10个字直接进行字符串截取，这里10个字不区分汉字和字母数字。
if(tvalnum>10){
var tval = $(this).val();
tval = tval.substring(0,10);
$(this).val(tval);
alert('长度超过限制，请控制在10个字以内！');
}
});
</script>
|
0
下载说明
· 本站下载链接均为网盘下载（百度网盘 & 微云网盘）；
· 推荐使用第三方专业下载工具下载本站软件，使用 WinRAR v3.10 以上版本解压本站软件；
· 如果这个软件总是不能下载的请点击报告错误,谢谢合作!!
· 下载本站资源，如果服务器暂不能下载请过一段时间重试！
· 本站提供的一些商业软件是供学习研究之用，如用于商业用途，请购买正版。