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 相关文章推荐
说说掌握JavaScript语言的思想前提想学习js的朋友可以看看
Apr 01 Javascript
拉动滚动条加载数据的jquery代码
May 03 Javascript
js用Date对象的setDate()函数对日期进行加减操作
Sep 18 Javascript
jQuery禁用键盘后退屏蔽F5刷新及禁用右键单击
Jan 22 Javascript
Javascript iframe交互并兼容各种浏览器的解决方法
Jul 12 Javascript
Node.js中防止错误导致的进程阻塞的方法
Aug 11 Javascript
xmlplus组件设计系列之列表(4)
Apr 26 Javascript
详解Angular的8个主要构造块
Jun 20 Javascript
详解基于 axios 的 Vue 项目 http 请求优化
Sep 04 Javascript
JS实现textarea通过换行或者回车把多行数字分割成数组并且去掉数组中空的值
Oct 29 Javascript
在vue中实现嵌套页面(iframe)
Jul 30 Javascript
vue route新窗口跳转页面并且携带与接收参数
Apr 10 Vue.js
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
本地计算机无法启动Apache故障处理
2014/08/08 PHP
Linux中为php配置伪静态
2014/12/17 PHP
php微信公众平台开发之获取用户基本信息
2015/08/17 PHP
phpStudy中升级MySQL版本到5.7.17的方法步骤
2017/08/03 PHP
PHP智能识别收货地址信息实例
2019/01/05 PHP
基于node.js的快速开发透明代理
2010/12/25 Javascript
基于jquery库的tab新形式使用
2012/11/16 Javascript
jquery text(),val(),html()方法区别总结
2013/11/04 Javascript
Nodejs中调用系统命令、Shell脚本和Python脚本的方法和实例
2015/01/01 NodeJs
JS实现光滑展开合拢的菜单效果代码
2015/09/16 Javascript
JavaScript中this的四个绑定规则总结
2016/09/26 Javascript
jquery动态赋值id与动态取id方法示例
2017/08/21 jQuery
vue中el-upload上传图片到七牛的示例代码
2018/10/19 Javascript
javascript实现考勤日历功能
2018/11/29 Javascript
Echarts实现多条折线可拖拽效果
2019/12/19 Javascript
如何解决vue在ios微信&quot;复制链接&quot;功能问题
2020/03/26 Javascript
原生JavaScript实现进度条
2021/02/19 Javascript
[01:32]dota2拉比克至宝(222)
2018/12/20 DOTA
简单谈谈python的反射机制
2016/06/28 Python
python中将函数赋值给变量时需要注意的一些问题
2017/08/18 Python
Python封装原理与实现方法详解
2018/08/28 Python
Python日期时间模块datetime详解与Python 日期时间的比较,计算实例代码
2018/09/14 Python
python实现五子棋人机对战游戏
2020/03/25 Python
python getpass实现密文实例详解
2019/09/24 Python
基于Python获取docx/doc文件内容代码解析
2020/02/17 Python
pytorch 中的重要模块化接口nn.Module的使用
2020/04/02 Python
Python爬取12306车次信息代码详解
2020/08/12 Python
ASOS英国官网:英国在线时装和化妆品零售商
2017/05/19 全球购物
Ray-Ban雷朋瑞典官方网站:全球领先的太阳眼镜品牌
2019/08/22 全球购物
描述一下JVM加载class文件的原理机制
2013/12/08 面试题
旅游项目开发策划书
2014/01/18 职场文书
理想点亮人生演讲稿
2014/05/21 职场文书
2016年入党心得体会范文
2016/01/23 职场文书
2019职场单身人才调研报告:互联网行业单身比例最高
2019/08/07 职场文书
SQL 窗口函数实现高效分页查询的案例分析
2021/05/21 SQL Server
Redis可视化客户端小结
2021/06/10 Redis