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 写类方式之十
Jul 05 Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
jQuery EasyUI API 中文文档 - Draggable 可拖拽
Sep 29 Javascript
js自定义事件及事件交互原理概述(一)
Feb 01 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
Oct 23 Javascript
jQuery子属性过滤选择器用法分析
Feb 10 Javascript
JavaScript实现Iterator模式实例分析
Jun 09 Javascript
JavaScript实现旋转轮播图
Aug 18 Javascript
node.js中http模块和url模块的简单介绍
Oct 06 Javascript
vue component 中引入less文件报错 Module build failed
Apr 17 Javascript
JS PHP字符串截取函数实现原理解析
Aug 29 Javascript
如何基于viewport vm适配移动端页面
Nov 13 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常见漏洞攻击分析
2016/02/21 PHP
6个常见的 PHP 安全性攻击实例和阻止方法
2020/12/16 PHP
解javascript 混淆加密收藏
2009/01/16 Javascript
使用jQuery实现dropdownlist的联动效果(sharepoint 2007)
2011/03/30 Javascript
jQuery源码中的chunker 正则过滤符分析
2012/07/31 Javascript
JS弹出层单纯的绝对定位居中示例代码
2014/02/18 Javascript
实例讲解JS中数组Array的操作方法
2014/05/09 Javascript
jQuery实现仿Alipay支付宝首页全屏焦点图切换特效
2015/05/04 Javascript
javascript实现鼠标放上后下边对应内容变换的效果
2015/08/06 Javascript
jquery实现顶部向右伸缩的导航区域代码
2015/09/02 Javascript
基于Jquery实现仿百度百科右侧导航代码附源码下载
2015/11/27 Javascript
JS获取月份最后天数、最大天数与某日周数的方法
2015/12/08 Javascript
JavaScript仿支付宝密码输入框
2015/12/29 Javascript
jQuery实现自动调用和触发某个事件的方法
2016/11/18 Javascript
如何写好你的JavaScript【推荐】
2017/03/02 Javascript
原生js简单实现放大镜特效
2017/05/16 Javascript
vue组件挂载到全局方法的示例代码
2018/08/02 Javascript
抖音上用记事本编写爱心小程序教程
2019/04/17 Javascript
JavaScript如何处理移动端拍摄图片旋转问题
2019/11/16 Javascript
微信小程序保持session会话的方法
2020/03/20 Javascript
Python牛刀小试密码爆破
2011/02/03 Python
python实现simhash算法实例
2014/04/25 Python
轻松实现TensorFlow微信跳一跳的AI
2018/01/05 Python
Python cookbook(数据结构与算法)从序列中移除重复项且保持元素间顺序不变的方法
2018/03/13 Python
python3实现指定目录下文件sha256及文件大小统计
2019/02/25 Python
Python爬虫爬取百度搜索内容代码实例
2020/06/05 Python
canvas实现圆绘制的示例代码
2019/09/11 HTML / CSS
德国柯吉澳趣味家居:Koziol
2017/08/24 全球购物
销售演讲稿范文
2014/01/08 职场文书
简历里的自我评价
2014/01/31 职场文书
工作时间上网检讨书
2014/02/03 职场文书
《小池塘》教学反思
2014/02/28 职场文书
ktv好的活动方案
2014/08/15 职场文书
最感人的道歉情书
2015/05/12 职场文书
人力资源部工作计划
2019/05/14 职场文书
前端学习——JavaScript原生实现购物车案例
2021/03/31 Javascript