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 相关文章推荐
使用prototype.js进行异步操作
Feb 07 Javascript
js对象关系图 方便dom操作
Mar 18 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
Jun 04 Javascript
javascript的propertyIsEnumerable()方法使用介绍
Apr 09 Javascript
基于jQuery全屏焦点图左右切换插件responsiveslides
Sep 07 Javascript
基于jQuery实现复选框是否选中进行答题提示
Dec 10 Javascript
jQuery Validate表单验证深入学习
Dec 18 Javascript
Webpack性能优化 DLL 用法详解
Aug 10 Javascript
微信小程序的部署方法步骤
Sep 04 Javascript
微信运维交互机器人的示例代码
Nov 12 Javascript
element-ui 时间选择器限制范围的实现(随动)
Jan 09 Javascript
vue+AI智能机器人回复功能实现
Jul 16 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
PHP常用代码
2006/11/23 PHP
用PHP读取RSS feed的代码
2008/08/01 PHP
PHP采集类Snoopy抓取图片实例
2014/06/19 PHP
php使用gettimeofday函数返回当前时间并存放在关联数组里
2015/03/19 PHP
Laravel中log无法写入问题的解决
2017/06/17 PHP
jQuery EasyUI API 中文文档 - ComboBox组合框
2011/10/07 Javascript
用原生JavaScript实现jQuery的$.getJSON的解决方法
2013/05/03 Javascript
jQuery插件formValidator自定义函数扩展功能实例详解
2015/11/25 Javascript
一起学写js Calender日历控件
2016/04/14 Javascript
JS使用单链表统计英语单词出现次数
2016/06/16 Javascript
基于jQuery实现淡入淡出效果轮播图
2020/07/31 Javascript
onmouseover事件和onmouseout事件全面理解
2016/08/15 Javascript
js style.display=block显示布局错乱问题的解决方法
2016/09/21 Javascript
JS获取年月日时分秒的方法分析
2016/11/28 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
2017/07/26 Javascript
基于dataset的使用和图片延时加载的实现方法
2017/12/11 Javascript
jQuery实现表格隔行换色
2018/09/01 jQuery
vue基于两个计算属性实现选中和全选功能示例
2019/02/08 Javascript
vscode中eslint插件的配置(prettier配置无效)
2019/09/10 Javascript
Django在win10下的安装并创建工程
2017/11/20 Python
深入浅析Python2.x和3.x版本的主要区别
2018/11/30 Python
spark dataframe 将一列展开,把该列所有值都变成新列的方法
2019/01/29 Python
详解Django-channels 实现WebSocket实例
2019/08/22 Python
python实现差分隐私Laplace机制详解
2019/11/25 Python
pip/anaconda修改镜像源,加快python模块安装速度的操作
2021/03/04 Python
什么是类的返射机制
2016/02/06 面试题
EJB的激活机制
2013/10/25 面试题
机关门卫岗位职责
2013/12/30 职场文书
文科生自我鉴定
2014/02/15 职场文书
自考毕业自我鉴定
2014/03/18 职场文书
2014年党员教师自我剖析材料
2014/09/30 职场文书
检察院起诉书
2015/05/20 职场文书
2015年为民办实事工作总结
2015/05/26 职场文书
六种css3实现的边框过渡效果
2021/04/22 HTML / CSS
一看就懂的MySQL的聚簇索引及聚簇索引是如何长高的
2021/05/25 MySQL
Pytest中conftest.py的用法
2021/06/27 Python