Jquery实现仿新浪微博获取文本框能输入的字数代码


Posted in Javascript onFebruary 22, 2013

limit.js代码

//txt:文本框jquery对象 
//limit:限制的字数 
//isbyte:true:视limit为字节数;false:视limit为字符数 
//cb:回调函数,参数为可输入的字数 
function InitLimit(txt,limit,isbyte,cb){ 
txt.keyup(function(){ 
var str=txt.val(); 
var charLen; 
var byteLen=0; 
if(isbyte){//原文博客:blog.csdn.net/bluceyoung 
for(var i=0;i<str.length;i++){ 
if(str.charCodeAt(i)>255){ 
byteLen+=2; 
}else{ 
byteLen++; 
} 
} 
charLen = Math.floor((limit-byteLen)/2); 
}else{ 
byteLen=str.length; 
charLen=limit-byteLen; 
} 
cb(charLen); 
}); 
}

页面代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> <head> 
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"> 
</script> 
<script type="text/javascript" src="limit.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
InitLimit($("#txt"),10,true,function(c){ 
if(c>=0){ 
$("#show").val("还能输入"+c+"个字"); 
}else{ 
$("#show").val("已经超过"+(-c)+"个字"); 
} 
}); 
InitLimit($("#txt1"),10,true,function(c){ 
if(c>=0){ 
$("#show1").val("还能输入"+c+"个字"); 
}else{ 
$("#show1").val("已经超过"+(-c)+"个字"); 
} 
}); 
}); 
</script> 
</head> 
<body> 
<input type="text" id="txt"/><input id="show" type="text"/><br/> 
<input type="text" id="txt1"/><input id="show1" type="text"/> 
</body> 
</html>

Jquery实现仿新浪微博获取文本框能输入的字数代码
Javascript 相关文章推荐
jquery中输入验证中一个不错的效果
Aug 21 Javascript
jquery 缓存问题的几个解决方法
Nov 11 Javascript
js使下拉列表框可编辑不止是选择
Dec 12 Javascript
JavaScript省市联动实现代码
Feb 15 Javascript
JavaScript编程中window的location与history对象详解
Oct 26 Javascript
DOM事件探秘篇
Feb 15 Javascript
扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框
Feb 21 Javascript
浅谈JS获取元素的N种方法及其动静态讨论
Aug 25 Javascript
原生js实现省市区三级联动代码分享
Feb 12 Javascript
spirngmvc js传递复杂json参数到controller的实例
Mar 29 Javascript
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
用Angular实现一个扫雷的游戏示例
May 15 Javascript
IE的fireEvent方法概述及应用
Feb 22 #Javascript
js取得url地址参数实例
Feb 22 #Javascript
js模拟滚动条(横向竖向)
Feb 22 #Javascript
js时间日期和毫秒的相互转换
Feb 22 #Javascript
jQuery的Ajax的自动完成功能控件简要说明
Feb 22 #Javascript
Javascript实现关联数据(Linked Data)查询及注意细节
Feb 22 #Javascript
JS中不为人知的五种声明Number的方式简要概述
Feb 22 #Javascript
You might like
德生S2000电路分析
2021/03/02 无线电
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
php自定义的格式化时间示例代码
2013/12/05 PHP
php遍历数组的4种方法总结
2014/07/05 PHP
PHP创建/删除/复制文件夹、文件
2016/05/03 PHP
PHP堆栈调试操作简单示例
2018/06/15 PHP
php实现微信企业转账功能
2018/10/02 PHP
由prototype_1.3.1进入javascript殿堂-类的初探
2006/11/06 Javascript
JavaScript For Beginners(转载)
2007/01/05 Javascript
Ext第一周 史上最强学习笔记---GridPanel(基础篇)
2008/12/29 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
2010/10/22 Javascript
关于query Javascript CSS Selector engine
2013/04/12 Javascript
JS正则表达式验证数字代码
2014/01/28 Javascript
详谈JavaScript内存泄漏
2014/11/14 Javascript
使用JavaScript和C#中获得referer
2014/11/14 Javascript
javascript实现修改微信分享的标题内容等
2014/12/11 Javascript
JavaScript的ExtJS框架中数面板TreePanel的使用实例解析
2016/05/21 Javascript
Vue.js对象转换实例
2017/06/07 Javascript
java和js实现的洗牌小程序
2019/09/30 Javascript
关于Node.js中频繁修改代码重启服务器的问题
2020/10/15 Javascript
python实现带验证码网站的自动登陆实现代码
2015/01/12 Python
python分割列表(list)的方法示例
2017/05/07 Python
HTML中使用python屏蔽一些基本功能的方法
2017/07/07 Python
python 接口_从协议到抽象基类详解
2017/08/24 Python
Python简单计算给定某一年的某一天是星期几示例
2018/06/27 Python
Python wxPython库Core组件BoxSizer用法示例
2018/09/03 Python
virtualenv 指定 python 解释器的版本方法
2018/10/25 Python
python 实现的车牌识别项目
2021/01/25 Python
Html5如何唤起百度地图App的方法
2019/01/27 HTML / CSS
使用canvas绘制超炫时钟
2014/12/17 HTML / CSS
法国一家多品牌成衣精品中/高档商店:Graduate Store
2019/08/28 全球购物
波兰品牌鞋履在线商店:Eastend.pl
2020/01/11 全球购物
什么是继承
2013/12/07 面试题
2014年旅游局法制宣传日活动总结
2014/11/01 职场文书
师德师风心得体会(2016精选篇)
2016/01/12 职场文书
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python