<!DOCTYPE html>
<html>
<head>
<meta charset=
"utf-8">
<title>demo</title>
</head>
<body>
<input id=
"text" placeHolder=
"最大支持12个字节" maxlength=
"12" />
<script type=
"text/javascript">
var Str =
{
byteLen : function (str){
//正则取到中文的个数，然后len*count+原来的长度。不用replace
str +=
'';
var tmp = str.match(/[^\x00-\xff]/g) ||
[];
return str.length +
tmp.length;
},
getMaxlen : function(str,maxlen){
var sResult =
'', L=
0, i=
0, stop =
false, sChar;
if(str.replace(/[^\x00-\xff]/g,
'xxx').length <=
maxlen){
return str;
}
while(!
stop){
sChar =
str.charAt(i);
L+= sChar.match(/[^\x00-\xff]/) ?
2 :
1;
if(L >
maxlen){
stop =
true;
}else{
sResult+=
sChar;
i++
;
}
}
return sResult;
}
};
var inputLock =
false;
document.querySelector('#text').addEventListener(
'compositionstart', function(){
inputLock =
true;
})
document.querySelector('#text').addEventListener(
'compositionend', function(){
inputLock =
false;
var value =
this.value,
maxlength =
this.getAttribute(
'maxlength');
if(Str.byteLen(value) >
maxlength){
this.value =
Str.getMaxlen(value, maxlength);
}
})
document.querySelector('#text').addEventListener(
'input', function(){
if(!
inputLock){
var value =
this.value,
maxlength =
this.getAttribute(
'maxlength');
if(Str.byteLen(value) >
maxlength){
this.value =
Str.getMaxlen(value, maxlength);
}
}
});
</script>
</body>
</html>
转载于:https://www.cnblogs.com/jkr666666/p/11173424.html
