1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <script type="text/javascript"> 7 window.onload = function(){ 8 var limitLength = document.getElementById('limitLength'), 9 clearNonumber = function(tThis){ 10 var _v = tThis.value, 11 _vLen = _v.length, 12 dataLength = tThis.getAttribute("data-length"),//获取长度属性 13 dataModel = tThis.getAttribute("data-model"), 14 subLen = dataLength; 15 if(_vLen > dataLength) 16 tThis.value = _v.substr(0,subLen);//判断长度 17 if(remainingCharacters){ //不知道这个是搞毛的。。。 18 self.showRemainingCharacters(!_vLen ? datalength:(_vLen>dataLength ? 0:dataLength-_vLen),remainingCharacters); 19 } 20 }; 21 limitLength.onfocus = function(){ //获取焦点事件 22 clearNonumber(this); 23 } 24 limitLength.onkeyup = function(){ //获取键盘事件 25 clearNonumber(this); 26 } 27 limitLength.onblur = function(){ //失去焦点事件 28 clearNonumber(this); 29 } 30 } 31 </script> 32 </head> 33 <body> 34 <h2>限制字符串长度</h2> 35 通过“maxlength”控制：<input type="text" name="Iname" maxlength="5" /><br/> 36 通过JS控制：<input type="text" name="Iname2" data-length='5' id='limitLength' data-model='Ch'/><br/> 37 </body> 38 </html>
代码来源----------《超实用JavaScript代码段》