文本框文字个数输入提示DEMO

最新推荐文章于 2021-03-09 19:05:23 发布

chiwanqi9869

最新推荐文章于 2021-03-09 19:05:23 发布

阅读量93

点赞数

原文链接：https://my.oschina.net/meSpace/blog/41884

版权

在需要判断的时候触发 T.doCheckLen('ti1', 'to1', 1, 50) 即可!

参数说明： T.doCheckLen('ti1', 'to1', 1, 50)
ti1 即需要捕捉的文本框文字的id
to1 即需要返回数字的id
1 1:提示文本框还能输入多少个字 2:提示文本框已经输入了多少个字
50 如果上面一个参数为1,则可以省略，否则填写，你想控制的文字个数

以上参数只是示例，根据自己的需要，自行替换！

附源码：格式贴进来就变了，自行调整一下吧，我也懒得调了

<html>
<head>
<title>文本框文字输入提示DEMO</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script>
//js Obj
var textLenObject = function(){
  var strTid = '';
  var strSid = '';
  var intLen = 0;

  //get Obj by id
  var getObj = function(id){
   return document.getElementByIdx_x_x_x_x_x_x(id);
  }

  //get the area length
  var getValueLen = function(){
   var strArea = getObj(strTid).value;
   return getSLen(strArea);
  }

  //count len by string
  var getSLen = function len(s){
   var l = 0;
   var a = s.split("");

   for(var i=0;i<a.length;i++){
    if(a[i].charCodeAt(0)<299){
     l++;
    }else{
     l+=2;
    }
   }
   return l;
  }

  //show the msg
  var showMsg = function(intTemp){
   var objShow = getObj(strSid);
   objShow.innerHTML = intTemp;
  }

  //Process
  var doProcess = function(intOpe){
   var intSLen = getValueLen();
   var intRLen = 0;

   intRLen = intOpe == 1 ? intLen - intSLen : intSLen;
   if(intRLen < 0) alert('不能再输入任何文字!');
   else showMsg(intRLen);
  }

  return{
   doCheckLen:function(strIid1, strId2, intOpe, intTLen){
    strTid = strIid1;
    strSid = strId2;
    intLen = intTLen;
    doProcess(intOpe);
   },
   doTest:function(){
    alert('Current object is ok!');
   }
  }
};
var T = new textLenObject();
</script>
</head>
<body>
*********************************************************************************<br/>
情况一：提示文本框还能输入多少个字<br/>
<textarea rows="5" cols='60' tabindex="4" οnkeyup="T.doCheckLen('ti1', 'to1', 1, 50);" id='ti1'></textarea><br/><br/>
您还可以输入 <font id='to1' color='red'>50</font> 个字<br/>

*********************************************************************************<br/>
情况二：提示文本框已经输入了多少个字<br/>
<textarea rows="5" cols='60' tabindex="4" οnkeyup="T.doCheckLen('ti2', 'to2', 2);" id='ti2'></textarea><br/><br/>
您已经输入了 <font id='to2' color='red'>0</font> 个字<br/>
*********************************************************************************<br/>
使用方法说明：<br/>
在需要判断的时候触发 T.doCheckLen('ti1', 'to1', 1, 50) 即可!
<br/><br/>
参数说明：
T.doCheckLen('ti1', 'to1', 1, 50)
<br/>ti1 即需要捕捉的文本框文字的id
<br/>to1 即需要返回数字的id
<br/>1 1:提示文本框还能输入多少个字 2:提示文本框已经输入了多少个字
<br/>50 如果上面一个参数为1,则可以省略，否则填写，你想控制的文字个数
<br/><br/>
以上参数只是示例，根据自己的需要，自行替换！
</body>
</html>