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 相关文章推荐
一个简单的JS时间控件示例代码(JS时分秒时间控件)
Nov 22 Javascript
js分页代码分享
Apr 28 Javascript
extjs 时间范围选择自动判断的实现代码
Jun 24 Javascript
使用JSON.parse将json字符串转换成json对象的时候会出错
Sep 04 Javascript
一个css与js结合的下拉菜单支持主流浏览器
Oct 08 Javascript
javascript 回调函数详解
Nov 11 Javascript
JavaScript实现数字数组正序排列的方法
Apr 06 Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 Javascript
浅谈React Native Flexbox布局(小结)
Jan 08 Javascript
在vue组件中使用axios的方法
Mar 16 Javascript
vue 根据数组中某一项的值进行排序的方法
Aug 30 Javascript
vue 详情跳转至列表页实现列表页缓存
Mar 27 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
无线电广播的开始
2002/01/30 无线电
ThinkPHP缓存方法S()概述
2014/06/13 PHP
php使用session二维数组实例
2014/11/06 PHP
php递归json类实例
2014/12/02 PHP
php使用escapeshellarg时中文被过滤的解决方法
2016/07/10 PHP
flexigrid 参数说明
2010/11/23 Javascript
Javascript基础教程之while语句
2015/01/18 Javascript
Jquery uploadify上传插件使用详解
2016/01/13 Javascript
三个js循环的关键字示例(for与while)
2016/02/16 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
老生常谈jquery中detach()和remove()的区别
2017/03/02 Javascript
浅谈如何使用 webpack 优化资源
2017/10/20 Javascript
详解webpack-dev-server的简单使用
2018/04/02 Javascript
Angular 5.x 学习笔记之Router(路由)应用
2018/04/08 Javascript
Javascript格式化并高亮xml字符串的方法及注意事项
2018/08/13 Javascript
vue-resource post数据时碰到Django csrf问题的解决
2020/03/13 Javascript
python写日志封装类实例
2015/06/28 Python
python3.6+opencv3.4实现鼠标交互查看图片像素
2018/02/26 Python
解决win64 Python下安装PIL出错问题(图解)
2018/09/03 Python
Python 中的lambda函数介绍
2018/10/10 Python
Python3多目标赋值及共享引用注意事项
2019/05/27 Python
使用Python轻松完成垃圾分类(基于图像识别)
2019/07/09 Python
pytorch 预训练层的使用方法
2019/08/20 Python
Python 实现一个手机号码获取妹子名字的功能
2019/09/25 Python
Python中无限循环需要什么条件
2020/05/27 Python
中国海淘族值得信赖的海淘返利网站:55海淘
2017/01/16 全球购物
Stutterheim瑞典:瑞典高级外套时装品牌
2019/06/24 全球购物
Vinatis德国:法国领先的葡萄酒邮购公司
2020/09/07 全球购物
中软国际Java程序员机试题
2012/08/19 面试题
焊接专业毕业生求职信
2013/10/01 职场文书
会议室标语
2014/06/21 职场文书
高中社区服务活动报告
2015/02/05 职场文书
小学班主任个人总结
2015/03/03 职场文书
迎新年主持词
2015/07/06 职场文书
Html5获取用户当前位置的几种方式
2022/01/18 HTML / CSS
分享Python获取本机IP地址的几种方法
2022/03/17 Python