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 相关文章推荐
分享几个超级震憾的图片特效
Jan 08 Javascript
js将控件隐藏的方法及display属性介绍
Jul 04 Javascript
在ASP.NET中使用JavaScript脚本的方法
Nov 12 Javascript
js中for in的用法示例解析
Dec 25 Javascript
jQuery满屏焦点图左右滚动特效代码分享
Sep 07 Javascript
js中通过getElementsByName访问name集合对象的方法
Oct 31 Javascript
vue使用drag与drop实现拖拽的示例代码
Sep 07 Javascript
vue实现验证码输入框组件
Dec 14 Javascript
JavaScript实现预览本地上传图片功能完整示例
Mar 08 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
Apr 26 Javascript
js滚轮事件 js自定义滚动条的实现
Jan 18 Javascript
Vue 解决通过this.$refs来获取DOM或者组件报错问题
Jul 28 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
日本十大最佳动漫,全都是二次元的神级作品
2019/10/05 日漫
php往mysql中批量插入数据实例教程
2018/12/12 PHP
豆瓣网的jquery代码实例
2008/06/15 Javascript
javascript事件问题
2009/09/05 Javascript
将函数的实际参数转换成数组的方法
2010/01/25 Javascript
让jQuery与其他JavaScript库并存避免冲突的方法
2013/12/23 Javascript
js对象基础实例分析
2015/01/13 Javascript
jQuery实现的支持IE的html滑动条
2015/03/16 Javascript
jQuery实现可展开合拢的手风琴面板菜单
2015/09/15 Javascript
node模块机制与异步处理详解
2016/03/13 Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
2016/07/11 Javascript
JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
2016/10/24 Javascript
js实现移动端编辑添加地址【模仿京东】
2017/04/28 Javascript
前端必备插件之纯原生JS的瀑布流插件Macy.js
2017/11/22 Javascript
js 两数组去除重复数值的实例
2017/12/06 Javascript
分析JS中this引发的bug
2017/12/12 Javascript
spirngmvc js传递复杂json参数到controller的实例
2018/03/29 Javascript
Vue-CLI 3.X 部署项目至生产服务器的方法
2019/03/22 Javascript
JavaScript的级联函数用法简单示例【链式调用】
2019/03/26 Javascript
JavaScript的Proxy可以做哪些有意思的事儿
2019/06/15 Javascript
JavaScript中BOM对象原理与用法分析
2019/07/09 Javascript
javascript实现前端成语点击验证优化
2020/06/24 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
2020/07/20 Javascript
浅谈vue.watch的触发条件是什么
2020/11/07 Javascript
[39:19]完美世界DOTA2联赛PWL S2 SZ vs LBZS 第二场 11.26
2020/11/30 DOTA
python读取csv和txt数据转换成向量的实例
2019/02/12 Python
python 根据字典的键值进行排序的方法
2019/07/24 Python
scrapy-splash简单使用详解
2021/02/21 Python
ghd澳大利亚官方网站:英国最受欢迎的美发工具品牌
2018/05/21 全球购物
西班牙自行车和跑步商店:Alltricks
2018/07/07 全球购物
波兰补充商店:Muscle Power
2018/10/29 全球购物
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
2014元旦晚会策划方案
2014/02/19 职场文书
会务接待方案
2014/02/27 职场文书
春节联欢晚会主持词
2014/03/24 职场文书
2016年妇联“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书