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 相关文章推荐
悄悄用脚本检查你访问过哪些网站的代码
Dec 04 Javascript
浅谈jQuery中 wrap() wrapAll() 与 wrapInner()的差异
Nov 12 Javascript
jQuery中:animated选择器用法实例
Dec 29 Javascript
tuzhu_req.js 实现仿百度图片首页效果
Aug 11 Javascript
属于你的jQuery提示框(Tip)插件
Jan 20 Javascript
vue时间格式化实例代码
Jun 13 Javascript
关于JavaScript 数组你应该知道的事情(推荐)
Apr 10 Javascript
详解vue页面首次加载缓慢原因及解决方案
Nov 06 Javascript
在pycharm中开发vue的方法步骤
Mar 04 Javascript
vue 函数调用加括号与不加括号的区别
Oct 29 Javascript
详解实现vue的数据响应式原理
Jan 20 Vue.js
JavaScript 防篡改对象的用法示例
Apr 24 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脚本的10个技巧(6)
2006/10/09 PHP
PHP中的print_r 与 var_dump 输出数组
2016/06/13 PHP
Laravel中服务提供者和门面模式的入门介绍
2017/11/06 PHP
ThinkPHP5.0框架验证码功能实现方法【基于第三方扩展包】
2019/03/11 PHP
JS定时器实例
2013/04/17 Javascript
仿当当网淘宝网等主流电子商务网站商品分类导航菜单
2013/09/25 Javascript
javascript获取四位数字或者字母的随机数
2015/01/09 Javascript
javascript常用的方法分享
2015/07/01 Javascript
Bootstrap实现input控件失去焦点时验证
2016/08/04 Javascript
浅谈Angular中ngModel的$render
2016/10/24 Javascript
javascript数据结构中栈的应用之符号平衡问题
2017/04/11 Javascript
jQuery实现的页面遮罩层功能示例【测试可用】
2017/10/14 jQuery
vue 实现通过手机发送短信验证码注册功能
2018/04/19 Javascript
如何用webpack4带你实现一个vue的打包的项目
2018/06/20 Javascript
cocos2dx+lua实现橡皮擦功能
2018/12/20 Javascript
jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法
2019/01/18 jQuery
package.json配置文件构成详解
2019/08/27 Javascript
微信小程序HTTP接口请求封装代码实例
2019/09/05 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
2020/07/19 Javascript
JavaScript实现4位随机验证码的生成
2021/01/28 Javascript
[01:11:37]完美世界DOTA2联赛PWL S2 SZ vs FTD.C 第一场 11.19
2020/11/19 DOTA
Python中多线程thread与threading的实现方法
2014/08/18 Python
Python3.6使用tesseract-ocr的正确方法
2018/10/17 Python
Pytorch 使用 nii数据做输入数据的操作
2020/05/26 Python
python 删除excel表格重复行,数据预处理操作
2020/07/06 Python
python 基于opencv去除图片阴影
2021/01/26 Python
HTML5实现的震撼3D焦点图动画的示例代码
2019/09/26 HTML / CSS
HTML5 canvas基本绘图之绘制曲线
2016/06/27 HTML / CSS
美国尼曼百货官网:Neiman Marcus
2019/09/05 全球购物
大宝sod蜜广告词
2014/03/21 职场文书
信用社主任竞聘演讲稿
2014/05/23 职场文书
小学国旗下的演讲稿
2014/08/28 职场文书
毕业论文致谢信
2015/05/14 职场文书
幸福来敲门观后感
2015/06/04 职场文书
python状态机transitions库详解
2021/06/02 Python
Win11怎么添加用户?Win11添加用户账户的方法
2022/07/15 数码科技