首页
所有分类
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 相关文章推荐
可以用鼠标拖动的DIV实现思路及代码
Oct 21 Javascript
fckeditor粘贴Word时弹出窗口取消的方法
Oct 30 Javascript
Javascript优化技巧之短路表达式详细介绍
Mar 27 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
Jun 11 Javascript
jquery模拟实现鼠标指针停止运动事件
Jan 12 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
Apr 29 Javascript
node.js路径处理方法以及绝对路径详解
Mar 04 Javascript
js模态对话框使用方法详解
Feb 16 Javascript
基于JavaScript实现简单的音频播放功能
Jan 07 Javascript
使用live-server快速搭建本地服务器+自动刷新的方法
Mar 09 Javascript
微信小程序自定义toast弹窗效果的实现代码
Nov 15 Javascript
vue中实现上传文件给后台实例详解
Aug 22 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
二级域名(1) 负载均衡(6) 默认端口(3) shell(3) 压力测试(1) 防盗链(1) reload(1) 前后端分离(1) 反向代理(2) 生成缩略图(1)
You might like
有关php运算符的知识大全
2011/11/03 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
thinkphp实现发送邮件密码找回功能实例
2014/12/01 PHP
基于PHP实现的事件机制实例分析
2015/06/18 PHP
JavaScript 模仿vbs中的 DateAdd() 函数的代码
2007/08/13 Javascript
一些不错的js函数ajax
2008/08/20 Javascript
动态创建样式表在各浏览器中的差异测试代码
2011/09/13 Javascript
Jquery 数据选择插件Pickerbox使用介绍
2012/08/24 Javascript
javascript 图片裁剪技巧解读
2012/11/15 Javascript
基于JQuery 选择器使用说明介绍
2013/04/18 Javascript
将两个div左右并列显示并实现点击标题切换内容
2013/10/22 Javascript
一个仿糯米弹框效果demo
2014/07/22 Javascript
nodejs入门教程一：概念与用法简介
2017/04/24 NodeJs
详解给Vue2路由导航钩子和axios拦截器做个封装
2018/04/10 Javascript
通过nodejs 服务器读取HTML文件渲染到页面的方法
2018/05/17 NodeJs
详解基于vue的服务端渲染框架NUXT
2018/06/20 Javascript
SVG实现时钟效果
2018/07/17 Javascript
深入解析Vue源码实例挂载与编译流程实现思路详解
2019/05/05 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
2019/09/11 Javascript
Python在不同目录下导入模块的实现方法
2017/10/27 Python
python程序封装为win32服务的方法
2021/03/07 Python
python-opencv颜色提取分割方法
2018/12/08 Python
Python Unittest根据不同测试环境跳过用例的方法
2018/12/16 Python
Pandas DataFrame中的tuple元素遍历的实现
2019/10/23 Python
Python爬虫小例子——爬取51job发布的工作职位
2020/07/10 Python
CSS3使用transition属性实现过渡效果
2018/04/18 HTML / CSS
老海军美国官网：Old Navy
2016/09/05 全球购物
三星印度官网：Samsung印度
2019/08/03 全球购物
大学生学年自我鉴定
2014/02/10 职场文书
培训专员岗位职责
2014/02/26 职场文书
企业安全生产演讲稿
2014/05/09 职场文书
2014年销售工作总结与计划
2014/12/01 职场文书
风雨哈佛路观后感
2015/06/03 职场文书
go原生库的中bytes.Buffer用法
2021/04/25 Golang
Python 用户输入和while循环的操作
2021/05/23 Python
python3中apply函数和lambda函数的使用详解
2022/02/28 Python