首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

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);

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
JavaScript实现页面实时显示当前时间的简单实例
Jul 20 Javascript
javascript实现表格排序 编辑 拖拽 缩放
Jan 02 Javascript
Javascript removeChild()删除节点及删除子节点的方法
Dec 27 Javascript
javascript之Boolean类型对象
Jun 07 Javascript
Avalonjs 实现简单购物车功能(实例代码)
Feb 07 Javascript
JavaScript实现动态增删表格的方法
Mar 09 Javascript
详解vee-validate的使用个人小结
Jun 07 Javascript
JS库之Particles.js中文开发手册及参数详解
Sep 13 Javascript
node.js基于express使用websocket的方法
Nov 09 Javascript
Vue.js 图标选择组件实践详解
Dec 03 Javascript
vue实现页面滚动到底部刷新
Aug 16 Javascript
react 路由Link配置详解
Nov 11 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
AE3805(1) 香港购物网站(84) 新加坡购物网站(41) 纸巾盒(1) 英国购物网站(954) 美国购物网站(1542) CPU(2) 天梯图(1) SLi Minor 2020(63) 爱尔兰购物网站(30)
You might like
解析php中die(),exit(),return的区别
2013/06/20 PHP
PHP递归创建多级目录
2015/11/05 PHP
PHP PDOStatement::fetch讲解
2019/01/31 PHP
PHP实现单例模式建立数据库连接的方法分析
2020/02/11 PHP
JavaScript 替换Html标签实现代码
2009/10/14 Javascript
javascript window对象属性整理
2009/10/24 Javascript
js 幻灯片的实现
2011/12/06 Javascript
Javascript自定义函数判断网站访问类型是PC还是移动终端
2014/01/10 Javascript
页面加载完毕后滚动条自动滚动一定位置
2014/02/20 Javascript
深入理解JavaScript系列（22）：S.O.L.I.D五大原则之依赖倒置原则DIP详解
2015/03/05 Javascript
JSON+Jquery省市区三级联动
2016/01/13 Javascript
javascript常用的设计模式
2017/02/09 Javascript
vue的状态管理模式vuex
2017/11/30 Javascript
JavaScript获取用户所在城市及地理位置
2018/04/21 Javascript
谈谈为什么你的 JavaScript 代码如此冗长
2019/01/30 Javascript
vue-router为激活的路由设置样式操作
2020/07/18 Javascript
[02:27]2018DOTA2亚洲邀请赛趣味视频之钓鱼大赛 谁是垂钓冠军？
2018/04/05 DOTA
[01:11:02]Secret vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python中requests模块的使用方法
2015/04/08 Python
Python自动发邮件脚本
2017/03/31 Python
python实现图片处理和特征提取详解
2017/11/13 Python
修改默认的pip版本为对应python2.7的方法
2018/11/06 Python
python文件转为exe文件的方法及用法详解
2019/07/08 Python
Python二次规划和线性规划使用实例
2019/12/09 Python
Flask框架搭建虚拟环境的步骤分析
2019/12/21 Python
浅析python连接数据库的重要事项
2021/02/22 Python
css3 flex布局 justify-content:space-between 最后一行左对齐
2020/01/02 HTML / CSS
联想印度官方网上商店：Lenovo India
2019/08/24 全球购物
自然健康的概念：Natural Healthy Concepts
2020/01/26 全球购物
教师新年寄语
2014/04/03 职场文书
8和9的加减法教学反思
2014/05/01 职场文书
创业培训计划书
2014/05/03 职场文书
党的群众路线教育实践活动个人整改措施
2014/10/27 职场文书
员工辞退通知书
2015/04/17 职场文书
在校证明模板
2015/06/17 职场文书
深入理解java.lang.String类的不可变性
2021/06/27 Java/Android