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 相关文章推荐
一段效率很高的for循环语句使用方法
Aug 13 Javascript
javascript 按键事件(兼容各浏览器)
Dec 20 Javascript
jQuery插件Zclip实现完美兼容个浏览器点击复制内容到剪贴板
Apr 30 Javascript
js实现Form栏显示全格式时间时钟效果代码
Aug 19 Javascript
深入解析JavaScript框架Backbone.js中的事件机制
Feb 14 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
May 04 Javascript
微信公众号  提示:Unauthorized API function 问题解决方法
Dec 05 Javascript
BootStrap Datepicker 插件修改为默认中文的实现方法
Feb 10 Javascript
bootstrap table服务端实现分页效果
Aug 10 Javascript
微信小程序使用toast消息对话框提示用户忘记输入用户名或密码功能【附源码下载】
Dec 09 Javascript
JS实现小星星特效
Dec 24 Javascript
微信小程序用户登录和登录态维护的实现
Dec 10 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
杏林同学录(四)
2006/10/09 PHP
PHP与MySQL开发中页面出现乱码的一种解决方法
2007/07/29 PHP
使用PHP similar text计算两个字符串相似度
2015/11/06 PHP
浅析php如何实现App常用的秒发功能
2016/08/03 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
几个比较实用的JavaScript 测试及效验工具
2010/04/18 Javascript
passwordStrength 基于jquery的密码强度检测代码使用介绍
2011/10/08 Javascript
jQuery 淡入淡出 png图在ie8下有黑色边框的解决方法
2013/03/05 Javascript
简介JavaScript中的getSeconds()方法的使用
2015/06/10 Javascript
Bootstrap中的Panel和Table全面解析
2016/06/13 Javascript
jquery基本选择器匹配多个元素的实现方法
2016/09/05 Javascript
jQuery实现简单弹窗遮罩效果
2017/02/27 Javascript
Bootstrap输入框组件简单实现代码
2017/03/06 Javascript
详解js类型判断
2018/05/22 Javascript
jQuery利用FormData上传文件实现批量上传
2018/12/04 jQuery
仿iPhone通讯录制作小程序自定义选择组件的实现
2019/05/23 Javascript
Jquery动态列功能完整实例
2019/08/30 jQuery
layui上传图片到服务器的非项目目录下的方法
2019/09/26 Javascript
vue.js实现三级菜单效果
2019/10/19 Javascript
JS如何生成随机验证码
2020/03/02 Javascript
vue-router路由懒加载及实现的3种方式
2021/02/28 Vue.js
Django + Uwsgi + Nginx 实现生产环境部署的方法
2018/06/20 Python
python生成1行四列全2矩阵的方法
2018/08/04 Python
详解python中list的使用
2019/03/15 Python
django drf框架中的user验证以及JWT拓展的介绍
2019/08/12 Python
django实现将修改好的新模型写入数据库
2020/03/31 Python
python软件都是免费的吗
2020/06/18 Python
python递归函数用法详解
2020/10/26 Python
去加拿大的旅行和假期:Canadian Affair
2016/10/25 全球购物
一份全面的PHP面试问题考卷
2012/07/15 面试题
户外活动总结范文
2014/04/30 职场文书
幼儿园园长新年寄语2015
2014/12/08 职场文书
2015年银行客户经理工作总结
2015/04/01 职场文书
2015年社区精神文明工作总结
2015/05/26 职场文书
2016年习主席讲话学习心得体会
2016/01/20 职场文书
阿里云服务器(windows)手动部署FTP站点详细教程
2022/08/05 Servers