您的位置:首页 > Web前端 > JavaScript

JS限制文本框录入长度(支持字符限制)

2013-03-21 10:43 113 查看
转:http://blog.csdn.net/civerb/article/details/4772007


功能/特点:

1.实时显示可输入的字数(字节数)

2.两种限制方式(长度、字节数)

3.中文输入法下可正常使用,无BUG

4.同一页面可以使用多个,相互不干扰

limit.js

function limit(){
var txtNote;//文本框
var txtLimit;//提示字数的input
var limitCount;//限制的字数
var isbyte;//是否使用字节长度限制(1汉字=2字符)
var txtlength;//到达限制时,字符串的长度
var txtByte;
this.init=function(){
txtNote=this.txtNote;
txtLimit=this.txtLimit;
limitCount=this.limitCount;
isbyte=this.isbyte;
txtNote.onkeydown=function(){wordsLimit()};txtNote.onkeyup=function(){wordsLimit()};
txtLimit.value=limitCount;
}
function wordsLimit(){
var noteCount=0;
if(isbyte){noteCount=txtNote.value.replace(/[^\x00-\xff]/g,"xx").length}else{noteCount=txtNote.value.length}
if(noteCount>limitCount){
if(isbyte){
txtNote.value=txtNote.value.substring(0,txtlength+Math.floor((limitCount-txtByte)/2));
txtByte=txtNote.value.replace(/[^\x00-\xff]/g,"xx").length;
txtLimit.value=limitCount-txtByte;
}else{
txtNote.value=txtNote.value.substring(0,limitCount);
txtLimit.value=0;
}
}else{
txtLimit.value=limitCount-noteCount;
}
txtlength=txtNote.value.length;//记录每次输入后的长度
txtByte=txtNote.value.replace(/[^\x00-\xff]/g,"xx").length;
}
}


<html>
<body>
<input id="txtNote" />
还可输入<input type="text"  id="txtCount"  />个字符
</body>
<mce:script type="text/javascript"><!--
var lim=new limit();
lim.txtNote=document.getElementById("txtNote");
lim.txtLimit=document.getElementById("txtCount");
lim.limitCount=20;
lim.isbyte=true;
lim.init();
// --></mce:script>
</html>


内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: