JQuery为textarea添加maxlength属性的代码


Posted in Javascript onApril 07, 2010

通过JQuery的keyup事件:

<html> 
<head> 
<title>JQuery为textarea添加maxlength</title> 
<script type="text/javascript" src="jquery-1.4.js"></script> 
</head> 
<body> 
<textarea style="width:300px; height:60px;" maxlength="10"></textarea> 
</body> 
</html> 
<script type="text/javascript"> 
$(function(){ 
$("textarea[maxlength]").keyup(function(){ 
var area=$(this); 
var max=parseInt(area.attr("maxlength"),10); //获取maxlength的值 
if(max>0){ 
if(area.val().length>max){ //textarea的文本长度大于maxlength 
area.val(area.val().substr(0,max)); //截断textarea的文本重新赋值 
} 
} 
}); 
}); 
</script>

如果只用keyup只能判断键盘输入的maxlength,利用鼠标的粘贴还是可以超过maxlength的限制,可以利用blur事件做判断:
$("textarea[maxlength]").blur(function(){ 
var area=$(this); 
var max=parseInt(area.attr("maxlength"),10); //获取maxlength的值 
if(max>0){ 
if(area.val().length>max){ //textarea的文本长度大于maxlength 
area.val(area.val().substr(0,max)); //截断textarea的文本重新赋值 
} 
} 
});

失去焦点后截断textarea的文本。
通过blur事件判断后还是有问题,如果是粘贴后直接提交而没有做对textarea的长度验证的情况下,还是会把textarea的全部内容提交。
Javascript 相关文章推荐
禁止F5等快捷键的JS代码
Mar 06 Javascript
javascript jQuery $.post $.ajax用法
Jul 09 Javascript
animate动画示例(泪奔的小孩)及stop和delay的使用
May 06 Javascript
js正文内容高亮效果的实现方法
Jun 30 Javascript
js实现window.open不被拦截的解决方法汇总
Oct 30 Javascript
JS函数的定义与调用方法推荐
May 12 Javascript
jQuery解决input元素的blur事件和其他非表单元素的click事件冲突问题
Aug 15 Javascript
ECMAScript6--解构
Mar 30 Javascript
使用cookie绕过验证码登录的实现代码
Oct 12 Javascript
node.js使用免费的阿里云ip查询获取ip所在地【推荐】
Sep 03 Javascript
微信小程序服务器日期格式化问题
Jan 07 Javascript
微信小程序实现首页弹出广告
Dec 03 Javascript
JavaScript和JQuery实用代码片段(一)
Apr 07 #Javascript
jquery 学习笔记一
Apr 07 #Javascript
ext jquery 简单比较
Apr 07 #Javascript
jQuery asp.net 用json格式返回自定义对象
Apr 07 #Javascript
FileUpload 控件 禁止手动输入或粘贴的实现代码
Apr 07 #Javascript
js 小贴士一星期合集
Apr 07 #Javascript
Javascript 实用小技巧
Apr 07 #Javascript
You might like
通过table标签,PHP输出EXCEL的实现方法
2013/07/24 PHP
php中apc缓存使用示例
2013/12/25 PHP
PHP MPDF中文乱码的解决方式
2015/12/08 PHP
php实现计算百度地图坐标之间距离的方法
2016/05/05 PHP
win10环境PHP 7 安装配置【教程】
2016/05/09 PHP
laravel5环境隐藏index.php后缀(apache)的方法
2019/10/12 PHP
PHP快速导出百万级数据到CSV或者EXCEL文件
2020/11/27 PHP
用Javascript实现UTF8编码转换成gb2312编码
2006/12/22 Javascript
一个JS翻页效果
2007/07/23 Javascript
js 面向对象的技术创建高级 Web 应用程序
2010/02/25 Javascript
javascript调试说明
2010/06/07 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
2011/03/28 Javascript
js中有关IE版本检测
2012/01/04 Javascript
如何让页面在打开时自动刷新一次让图片全部显示
2012/12/17 Javascript
JS获得浏览器版本和操作系统版本的例子
2014/05/13 Javascript
JavaScript_ECMA5数组新特性详解
2016/06/12 Javascript
利用yarn实现一个webpack+react种子
2016/10/25 Javascript
JS实现的随机排序功能算法示例
2017/06/09 Javascript
node 使用 async 控制并发的方法
2018/05/07 Javascript
vue监听键盘事件的快捷方法【推荐】
2018/07/11 Javascript
create-react-app中添加less支持的实现
2019/11/15 Javascript
vue中利用three.js实现全景图的完整示例
2020/12/07 Vue.js
[42:06]2019国际邀请赛全明星赛 8.23
2019/09/05 DOTA
Python中线程编程之threading模块的使用详解
2015/06/23 Python
Python实现爬虫设置代理IP和伪装成浏览器的方法分享
2018/05/07 Python
python事件驱动event实现详解
2018/11/21 Python
django最快程序开发流程详解
2019/07/19 Python
PatPat香港:婴童服饰和亲子全家装在线购物
2020/09/27 全球购物
The North Face官方旗舰店:美国著名户外品牌
2020/09/28 全球购物
银行会计财务工作个人的自我评价
2013/10/29 职场文书
拾金不昧的表扬信
2014/01/16 职场文书
C++程序员求职信
2014/05/07 职场文书
怎样写离婚协议书
2014/09/10 职场文书
财务部岗位职责范本
2015/04/14 职场文书
《活见鬼》教学反思
2016/02/24 职场文书
python基础之//、/与%的区别详解
2022/06/10 Python