TextArea 控件的最大长度问题(js json)


Posted in Javascript onDecember 16, 2009

如果只是单纯地想限制 textarea 中的字数,不想写太多的话,可用:

<textarea onkeyup="this.value = this.value.slice(0, 80)"></textarea>

<textarea onkeyup="this.value = this.value.substring(0, 80)"></textarea>

在 textarea 的 onkeyup 中检查字数之方法:

<script language="javascript" type="text/javascript"> 
function DjCheckMaxlength(oInObj) 
{ 
var iMaxLen = parseInt(oInObj.getAttribute('maxlength')); 
var iCurLen = oInObj.value.length; if ( oInObj.getAttribute && iCurLen > iMaxLen ) 
{ 
oInObj.value = oInObj.value.substring(0, iMaxLen); 
} 
} //@ END OF DjCheckMaxlength() 
</script> 
<textarea maxlength="80" onkeyup="return DjCheckMaxlength(this);"></textarea>

o 设定好自动去检查所有的 textarea 之方法:
<head> 
<script language="javascript" type="text/javascript"> 
function DjTextArea_AddMaxlengthAttr() 
{ 
var aX = document.getElementsByTagName('textarea'); for ( var iI = 0; aX.length > iI; iI++ ) 
{ 
if ( aX[iI].getAttribute('maxlength') ) 
{ 
aX[iI].onkeyup = aX[iI].onchange = DjTextArea_CheckMaxlength; 
} 
} 
} //@ END OF DjTextArea_AddMaxlengthAttr() 
function DjTextArea_CheckMaxlength() 
{ 
var iMaxLen = parseInt(this.getAttribute('maxlength')); 
var iCurLen = this.value.length; 
if ( this.getAttribute && iCurLen > iMaxLen ) 
{ 
this.value = this.value.substring(0, iMaxLen); 
} 
} //@ END OF DjTextArea_CheckMaxlength() 
</script> 
</head> 
<body onload="DjTextArea_AddMaxlengthAttr();">

var Inputs = { OnIntegerOnly: function() { 
var k = System.isIE ? event.keyCode : event.which; 
if(event.ctrlKey || event.ctrlAlt || event.shiftKey) { 
Inputs.DisableInput(event); 
return; 
} 
if ( ( k < 48 || k > 57 ) 
&& 8 != k 
&& 9 != k 
&& 46 != k 
&& 37 != k 
&& 39 != k 
&& 16 != k 
&& 36 != k 
&& 35 != k 
&& 17 != k 
&& 13 != k 
&& ( k < 96 || k > 105 ) 
) { 
Inputs.DisableInput(event); 
} 
return k; 
}, 
OnDecimalOnly: function() { 
var k = System.isIE ? event.keyCode : event.which; 
if(event.ctrlKey || event.ctrlAlt || event.shiftKey) { 
Inputs.DisableInput(event); 
return; 
} 
if( ( k < 48 || k > 57 ) 
&& 8 != k 
&& 9 != k 
&& 46 != k 
&& 37 != k 
&& 39 != k 
&& 16 != k 
&& 36 != k 
&& 35 != k 
&& 17 != k 
&& 13 != k 
&& 190 != k 
&& 110 != k 
&& ( k < 96 || k > 105 ) 
) { 
Inputs.DisableInput(event); 
} 
return k; 
}, 
OnAsciiOnly: function() { 
var k = System.isIE ? event.keyCode : event.which; 
if ( ( k < 97 || k > 122 ) 
&& ( k < 65 || k > 90 ) 
&& ( k < 48 || k > 57 ) 
&& 8 != k 
&& 9 != k 
&& 46 != k 
&& 37 != k 
&& 39 != k 
&& 16 != k 
&& 36 != k 
&& 35 != k 
&& 17 != k 
&& 13 != k 
&& 189 != k 
&& 187 != k 
) { 
Inputs.DisableInput(event); 
} 
return k; 
}, 
DisableInput: function(event) { 
if(System.isIE) 
event.returnValue = false; 
else 
event.preventDefault(); 
}, 
AddOnPos: function(obj, charvalue) { 
//obj代表要插入字符的输入框 
//value代表要插入的字符 
obj.focus(); 
var r = document.selection.createRange(); 
var ctr = obj.createTextRange(); 
var i; 
var s = obj.value; 
//注释掉的这种方法只能用在单行的输入框input内 
//对多行输入框textarea无效 
//r.setEndPoint("StartToStart", ctr); 
//i = r.text.length; 
//取到光标位置----Start---- 
var ivalue = "&^asdjfls2FFFF325%$^&"; 
r.text = ivalue; 
i = obj.value.indexOf(ivalue); 
r.moveStart("character", -ivalue.length); 
r.text = ""; 
//取到光标位置----End---- 
//插入字符 
obj.value = s.substr(0,i) + charvalue + s.substr(i,s.length); 
ctr.collapse(true); 
ctr.moveStart("character", i + charvalue.length); 
ctr.select(); 
}, 
MaxLength: function() { 
var _this = event.srcElement; 
var iMaxLen = parseInt(_this.getAttribute('maxlength')); 
switch(event.type) { 
case 'beforepaste': { 
event.returnValue = false; 
} break; 
case 'paste': { 
var iTxtLen = _this.value.lenUTF8(); 
var txtCbd = window.clipboardData.getData("Text"); 
var iCbdLen = txtCbd.lenUTF8(); 
if((iMaxLen - iTxtLen) <= iCbdLen) { 
var iSurplusLen = iMaxLen - iTxtLen; 
var subStr = txtCbd.substr(0, iSurplusLen); 
var insertStr = ''; 
for(var i = 0; i < subStr.length; i++) { 
var chr = subStr.substr(i, 1); 
if(iSurplusLen >= chr.lenUTF8()) { 
insertStr += chr; 
iSurplusLen -= chr.lenUTF8(); 
} 
} 
Inputs.AddOnPos(_this, insertStr); 
//_this.style.backgroundColor = 'red'; 
//System.setTimeout(Inputs.ColorTips, 500, _this); 
event.returnValue = false; 
event.srcElement.style.imeMode = 'disabled'; 
} else { 
event.returnValue = true; 
event.srcElement.style.imeMode = 'auto'; 
} 
} break; 
case 'keypress': { 
var iTxtLen = _this.value.lenUTF8(); 
if(iMaxLen <= iTxtLen) { 
while(_this.value.lenUTF8() > iMaxLen) { 
_this.value = _this.value.substr(0, _this.value.length - 1); 
} 
Inputs.DisableInput(event); 
if('disabled' != event.srcElement.style.imeMode) { 
event.srcElement.style.imeMode = 'disabled'; 
} 
} 
else { 
if('auto' != event.srcElement.style.imeMode) { 
event.srcElement.style.imeMode = 'auto'; 
} 
} 
} break; 
case 'keyup': { 
var k = System.isIE ? event.keyCode : event.which; 
if (8 != k 
&& 9 != k 
&& 46 != k 
&& 37 != k 
&& 39 != k 
&& 16 != k 
&& 36 != k 
&& 35 != k 
&& 17 != k 
&& 13 != k 
&& 189 != k 
&& 187 != k 
) { 
if(_this.getAttribute) { 
_this.fireEvent('onkeypress'); 
} 
} 
} break; 
case 'keydown': { 
var k = System.isIE ? event.keyCode : event.which; 
if (8 != k 
&& 9 != k 
&& 46 != k 
&& 37 != k 
&& 39 != k 
&& 16 != k 
&& 36 != k 
&& 35 != k 
&& 17 != k 
&& 13 != k 
&& 189 != k 
&& 187 != k 
) { 
var iTxtLen = _this.value.lenUTF8(); 
if(iMaxLen <= iTxtLen) { 
Inputs.DisableInput(event); 
} 
} 
} break; 
} 
}, 
TextAreaMaxLength: function() { 
var aX = document.getElementsByTagName('textarea'); 
for(var i = 0; i < aX.length; i++) { 
if(aX[i].getAttribute('maxlength')) { 
aX[i].detachEvent('onbeforepaste', Inputs.MaxLength); 
aX[i].detachEvent('onpaste', Inputs.MaxLength); 
aX[i].detachEvent('onkeypress', Inputs.MaxLength); 
aX[i].detachEvent('onkeyup', Inputs.MaxLength); 
aX[i].detachEvent('onkeydown', Inputs.MaxLength); 
aX[i].attachEvent('onbeforepaste', Inputs.MaxLength); 
aX[i].attachEvent('onpaste', Inputs.MaxLength); 
aX[i].attachEvent('onkeypress', Inputs.MaxLength); 
aX[i].attachEvent('onkeyup', Inputs.MaxLength); 
aX[i].attachEvent('onkeydown', Inputs.MaxLength); 
/* 
var res = 'zh-cn' == window.navigator.systemLanguage 
? '最大长度:' 
: 'Maximum length for: '; 
if('' == aX[i].title) aX[i].title = res + aX[i].getAttribute('maxlength'); 
*/ 
} 
} 
}, 
TextBoxMaxLength: function() { 
var aX = document.getElementsByTagName('input'); 
for(var i = 0; i < aX.length; i++) { 
var maxLen = aX[i].getAttribute('maxlength'); 
if('text' == aX[i].type 
&& null != maxLen 
&& '' != maxLen 
&& undefined != maxLen 
&& 2147483647 > parseInt(maxLen) 
&& '' == aX[i].title) { 
aX[i].detachEvent('onbeforepaste', Inputs.MaxLength); 
aX[i].detachEvent('onpaste', Inputs.MaxLength); 
aX[i].detachEvent('onkeypress', Inputs.MaxLength); 
aX[i].detachEvent('onkeyup', Inputs.MaxLength); 
aX[i].attachEvent('onbeforepaste', Inputs.MaxLength); 
aX[i].attachEvent('onpaste', Inputs.MaxLength); 
aX[i].attachEvent('onkeypress', Inputs.MaxLength); 
aX[i].attachEvent('onkeyup', Inputs.MaxLength); 
/* 
var res = 'zh-cn' == window.navigator.systemLanguage 
? '最大长度:' 
: 'Maximum length for: '; 
aX[i].title = res + aX[i].getAttribute('maxlength'); 
*/ 
} 
} 
} 
} 
Tools.Inputs = Inputs; 
window.attachEvent('onload', Tools.Inputs.TextAreaMaxLength); 
window.attachEvent('onload', Tools.Inputs.TextBoxMaxLength);
Javascript 相关文章推荐
限制复选框的最大可选数
Jul 01 Javascript
JavaScript语句可以不以;结尾的烦恼
Mar 08 Javascript
javascript的键盘控制事件说明
Apr 15 Javascript
基于jQuery实现的当离开页面时出现提示的实现代码
Jun 27 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
Mar 01 Javascript
jQuery Ajax 加载数据时异步显示加载动画
Aug 01 Javascript
详解vue数据渲染出现闪烁问题
Jun 29 Javascript
解决vue打包后vendor.js文件过大问题
Jul 03 Javascript
MockJs结合json-server模拟后台数据
Aug 26 Javascript
封装微信小程序http拦截器过程解析
Aug 13 Javascript
解决ele ui 表格表头太长问题的实现
Nov 13 Javascript
基于JavaScript实现控制下拉列表
May 08 Javascript
比较详细的关于javascript 解析json的代码
Dec 16 #Javascript
JQuery读取XML文件数据并显示的实现代码
Dec 16 #Javascript
js实现页面打印功能实例代码(附去页眉页脚功能代码)
Dec 15 #Javascript
jQuery 渐变下拉菜单
Dec 15 #Javascript
多浏览器兼容的获取元素和鼠标的位置的js代码
Dec 15 #Javascript
讨论javascript(一)工厂方式 js面象对象的定义方法
Dec 15 #Javascript
查询绑定数据岛的表格中的文本并修改显示方式的js代码
Dec 15 #Javascript
You might like
检查php文件中是否含有bom的函数
2012/05/31 PHP
测试php函数的方法
2013/11/13 PHP
PHP可变函数学习小结
2015/11/29 PHP
session 加入redis的实现代码
2016/07/15 PHP
thinkPHP订单数字提醒功能的实现方法
2016/12/01 PHP
php面向对象程序设计入门教程
2019/06/22 PHP
win10下 php安装seaslog扩展的详细步骤
2020/12/04 PHP
jquery实现奇偶行赋值不同css值
2012/02/17 Javascript
jquery选择器的选择使用及性能介绍
2013/01/16 Javascript
用Js实现的动态增加表格示例自己写的
2013/10/21 Javascript
浅谈angularJS 作用域
2015/07/05 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
jQuery实现的购物车物品数量加减功能代码
2016/11/16 Javascript
原生js实现旋转木马轮播图效果
2017/02/27 Javascript
基于jQuery实现手风琴菜单、层级菜单、置顶菜单、无缝滚动效果
2017/07/20 jQuery
vue获取dom元素注意事项
2017/12/28 Javascript
AngularJS双向数据绑定原理之$watch、$apply和$digest的应用
2018/01/30 Javascript
nodejs简单读写excel内容的方法示例
2018/03/16 NodeJs
vue移动端弹框组件的实例
2018/09/25 Javascript
react的滑动图片验证码组件的示例代码
2019/02/27 Javascript
vue v-for循环重复数据无法添加问题解决方法【加track-by='索引'】
2019/03/15 Javascript
JavaScript装饰者模式原理与用法实例详解
2020/03/09 Javascript
微信h5静默和非静默授权获取用户openId的方法和步骤
2020/06/08 Javascript
跟老齐学Python之私有函数和专有方法
2014/10/24 Python
Python的Django框架中自定义模版标签的示例
2015/07/20 Python
Python竟能画这么漂亮的花,帅呆了(代码分享)
2017/11/15 Python
Python实现的插入排序算法原理与用法实例分析
2017/11/22 Python
python实现图片批量压缩程序
2018/07/23 Python
python实现抖音点赞功能
2019/04/07 Python
解决pytorch 交叉熵损失输出为负数的问题
2020/07/07 Python
Python中实现一行拆多行和多行并一行的示例代码
2020/09/06 Python
自主招生推荐信范文
2014/05/10 职场文书
研究生毕业论文导师评语
2014/12/31 职场文书
孔庙导游词
2015/02/04 职场文书
python实现图片九宫格分割的示例
2021/04/25 Python
Python Django项目和应用的创建详解
2021/11/27 Python