input 和 textarea 输入框最大文字限制的jquery插件


Posted in Javascript onOctober 27, 2011
/* input 和 textarea 最大文字限定插件 
* 修改版, 一个中文表示1一个字, 一个英文半个字; 
* TextLimit - jQuery plugin for counting and limiting characters for input and textarea fields 
* 
* pass '-1' as speed if you don't want the char-deletion effect. (don't just put 0) 
* Example: jQuery("Textarea").textlimit('span.counter',256) 
* 
* $Version: 2009.07.25 +r2 
* Copyright (c) 2009 Yair Even-Or 
* vsync.design@gmail.com 
*/ String.prototype.getBytes = function () { 
var cArr = this.match(/[^\x00-\xff]/ig); 
return this.length + (cArr == null ? 0 : cArr.length); 
}; 
(function(jQuery) { 
jQuery.fn.textlimit=function(counter_el, thelimit, speed) { 
var charDelSpeed = speed || 15; 
var toggleCharDel = speed != -1; 
var toggleTrim = true; 
var that = this[0]; 
var isCtrl = false; 
updateCounter(); 
function updateCounter(){ 
if(typeof that == "object") 
jQuery(counter_el).text(thelimit - Math.ceil(that.value.getBytes()/2)); 
}; 
this.keydown (function(e){ 
if(e.which == 17) isCtrl = true; 
var ctrl_a = (e.which == 65 && isCtrl == true) ? true : false; // detect and allow CTRL + A selects all. 
var ctrl_v = (e.which == 86 && isCtrl == true) ? true : false; // detect and allow CTRL + V paste. 
// 8 is 'backspace' and 46 is 'delete' 
if( this.value.length >= thelimit && e.which != '8' && e.which != '46' && ctrl_a == false && ctrl_v == false) 
e.preventDefault(); 
}) 
.keyup (function(e){ 
updateCounter(); 
if(e.which == 17) 
isCtrl=false; 
if( this.value.length >= thelimit && toggleTrim ){ 
if(toggleCharDel){ 
// first, trim the text a bit so the char trimming won't take forever 
// Also check if there are more than 10 extra chars, then trim. just in case. 
if ( (this.value.length - thelimit) > 10 ) 
that.value = that.value.substr(0,thelimit+100); 
var init = setInterval 
( 
function(){ 
if( that.value.length <= thelimit ){ 
init = clearInterval(init); updateCounter() 
} 
else{ 
// deleting extra chars (one by one) 
that.value = that.value.substring(0,that.value.length-1); jQuery(counter_el).text(Math.ceil(that.value.getBytes()/2)); 
} 
} ,charDelSpeed 
); 
} 
else this.value = that.value.substr(0,thelimit); 
} 
}); 
}; 
})(jQuery);
Javascript 相关文章推荐
ExtJS 2.2.1的grid控件在ie6中的显示问题
May 04 Javascript
Draggable Elements 元素拖拽功能实现代码
Mar 30 Javascript
javascript 快速排序函数代码
May 30 Javascript
Firefox和IE兼容性问题及解决方法总结
Oct 08 Javascript
XML文件转化成NSData对象的方法
Aug 12 Javascript
js实现上下左右弹框划出效果
Mar 08 Javascript
ES6深入理解之“let”能替代”var“吗?
Jun 28 Javascript
vue.js项目nginx部署教程
Apr 05 Javascript
Vue列表循环从指定下标开始的多种解决方案
Apr 08 Javascript
vue-cli3项目打包后自动化部署到服务器的方法
Sep 16 Javascript
在Vue中使用Echarts实例图的方法实例
Oct 10 Javascript
代码块高亮可复制显示js插件highlight.js+clipboard.js整合
Feb 15 Javascript
VBS通过WMI监视注册表变动的代码
Oct 27 #Javascript
JavaScript Memoization 让函数也有记忆功能
Oct 27 #Javascript
JavaScript 类型的包装对象(Typed Wrappers)
Oct 27 #Javascript
40款非常棒的jQuery 插件和制作教程(系列一)
Oct 26 #Javascript
JavaScript学习笔记(二) js对象
Oct 25 #Javascript
JavaScript学习笔记(一) js基本语法
Oct 25 #Javascript
jQuery数据显示插件整合实现代码
Oct 24 #Javascript
You might like
php发送post请求的三种方法
2014/02/11 PHP
smarty内置函数config_load用法实例
2015/01/22 PHP
thinkPHP线上自动加载异常与修复方法实例分析
2016/12/01 PHP
JS延迟加载加快页面打开速度示例代码
2013/12/30 Javascript
jQuery结合HTML5制作的爱心树表白动画
2015/02/01 Javascript
使用Script元素发送JSONP请求的方法
2016/06/12 Javascript
Web前端框架bootstrap实战【第一次接触使用】
2016/12/28 Javascript
react-router实现跳转传值的方法示例
2017/05/27 Javascript
Three.js基础学习之场景对象
2017/09/27 Javascript
JavaScript学习笔记之数组基本操作示例
2019/01/09 Javascript
JS实现数组去重及数组内对象去重功能示例
2019/02/02 Javascript
JS桶排序的简单理解与实现方法示例
2019/11/25 Javascript
尝试用最短的Python代码来实现服务器和代理服务器
2016/06/23 Python
Python使用微信SDK实现的微信支付功能示例
2017/06/30 Python
Pipenv一键搭建python虚拟环境的方法
2018/05/22 Python
python 多进程并行编程 ProcessPoolExecutor的实现
2019/10/11 Python
Python装饰器原理与基本用法分析
2020/01/07 Python
python3爬取torrent种子链接实例
2020/01/16 Python
你可能不知道的Python 技巧小结
2020/01/29 Python
django rest framework 自定义返回方式
2020/07/12 Python
Python爬虫基于lxml解决数据编码乱码问题
2020/07/31 Python
HTML5 Web Database 数据库的SQL语句的使用方法
2012/12/09 HTML / CSS
浅谈html5标签css3的常用样式
2016/10/20 HTML / CSS
欧洲著名的珠宝和手表网上商城:uhrcenter
2017/04/10 全球购物
娇韵诗加拿大官网:Clarins加拿大
2017/11/20 全球购物
澳大利亚最大的网上油画销售画廊:Direct Art Australia
2018/04/15 全球购物
怎样让char类型的东西转换成int类型
2013/12/09 面试题
评析教师个人的自我评价
2014/02/19 职场文书
演讲稿祖国在我心中
2014/05/04 职场文书
春季运动会开幕词
2015/01/28 职场文书
青年志愿者服务活动总结
2015/05/06 职场文书
宇宙与人观后感
2015/06/05 职场文书
2015国庆66周年宣传语
2015/07/14 职场文书
女人创业励志语录,句句蕴含能量,激发你的潜能
2019/08/20 职场文书
祝福语集锦:送给闺蜜的生日祝福语
2019/10/08 职场文书
利用uni-app生成微信小程序的踩坑记录
2022/04/05 Javascript