jquery判断字符输入个数(数字英文长度记为1,中文记为2,超过长度自动截取)


Posted in Javascript onOctober 15, 2010

1. $('textarea#txtPrizeNote'); //表示textarea控件名称
2. 'span' 显示剩余字数的标签
HTML:

<div> 
<textarea id="txtPrizeNote" runat="server" height="74px" width="480px" maxlength="10" 
style="width: 480px; height: 74px; float: left"></textarea> 
<span style="color: Red;">*</span><br /> 
剩余字数:<span id="showmsg" style="color: red"></span> 
</div>

<script type="text/javascript"> 
//返回val的字节长度 
function getByteLen(val) { 
var len = 0; 
for (var i = 0; i < val.length; i++) { 
if (val[i].match(/[^\x00-\xff]/ig) != null) //全角 
len += 2; 
else 
len += 1; 
} 
return len; 
} 
//返回val在规定字节长度max内的值 
function getByteVal(val, max) { 
var returnValue = ''; 
var byteValLen = 0; 
for (var i = 0; i < val.length; i++) { 
if (val[i].match(/[^\x00-\xff]/ig) != null) 
byteValLen += 2; 
else 
byteValLen += 1; 
if (byteValLen > max) 
break; 
returnValue += val[i]; 
} 
return returnValue; 
} 
$(function() { 
var _area = $('textarea#txtPrizeNote'); 
var _info = _area.next(); 
var _max = _area.attr('maxlength'); 
var _val; 
_area.bind('keyup change', function() { //绑定keyup和change事件 
if (_info.find('span').size() < 1) {//避免每次弹起都会插入一条提示信息 
_info.append(_max); 
} 
_val = $(this).val(); 
_cur = getByteLen(_val); 
if (_cur == 0) {//当默认值长度为0时,可输入数为默认maxlength值 
_info.text(_max); 
} else if (_cur < _max) {//当默认值小于限制数时,可输入数为max-cur 
_info.text(_max - _cur); 
} else {//当默认值大于等于限制数时 
_info.text(0); 
$(this).val(getByteVal(_val,_max)); //截取指定字节长度内的值 
} 
}); 
}); 
</script>
Javascript 相关文章推荐
IE DOM实现存在的部分问题及解决方法
Jul 25 Javascript
javascript语言结构小记(一)
Sep 10 Javascript
js写的评论分页(还不错)
Dec 23 Javascript
js的window.showModalDialog及window.open用法实例分析
Jan 29 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
Apr 27 Javascript
Jquery和Js获得元素标签名称的方法总结
Oct 08 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
Nov 07 Javascript
基于JavaScript实现新增内容滚动播放效果附完整代码
Aug 24 Javascript
详解封装基础的angular4的request请求方法
Jun 05 Javascript
通过实践编写优雅的JavaScript代码
May 30 Javascript
vue的三种图片引入方式代码实例
Nov 19 Javascript
Vue.js原理分析之nextTick实现详解
Sep 07 Javascript
jquery 元素相对定位代码
Oct 15 #Javascript
JQuery小知识
Oct 15 #Javascript
JQuery1.4+ Ajax IE8 内存泄漏问题
Oct 15 #Javascript
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
Oct 14 #Javascript
js限制文本框为整数和货币的函数代码
Oct 13 #Javascript
javascript中&quot;/&quot;运算符常见错误
Oct 13 #Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
Oct 13 #Javascript
You might like
PHP将DateTime对象转化为友好时间显示的实现代码
2011/09/20 PHP
CodeIgniter与PHP5.6的兼容问题
2015/07/16 PHP
使用PHP+AJAX让WordPress动态加载文章的教程
2015/12/11 PHP
在WordPress的文章编辑器中设置默认内容的方法
2015/12/29 PHP
动态调用css文件——jquery的应用
2007/02/20 Javascript
一个js拖拽的效果类和dom-drag.js浅析
2010/07/17 Javascript
javascript模拟枚举的简单实例
2014/03/06 Javascript
JavaScript Math.ceil 方法(对数值向上取整)
2015/01/09 Javascript
Javascript中的迭代、归并方法详解
2016/06/14 Javascript
javascript中获取元素标签中间的内容的实现方法
2016/10/08 Javascript
js将table的每个td的内容自动赋值给其title属性的方法
2016/10/13 Javascript
canvas知识总结
2017/01/25 Javascript
Angular.js中数组操作的方法教程
2017/07/31 Javascript
form表单序列化详解(推荐)
2017/08/15 Javascript
移动端网页开发调试神器Eruda的介绍与使用技巧
2017/10/30 Javascript
Node.js中DNS模块学习总结
2018/02/28 Javascript
基于vue 添加axios组件,解决post传参数为null的问题
2018/03/05 Javascript
Angular使用ControlValueAccessor创建自定义表单控件
2019/03/08 Javascript
vue中使用[provide/inject]实现页面reload的方法
2019/09/30 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
2020/04/11 Javascript
Python实现树的先序、中序、后序排序算法示例
2017/06/23 Python
python实现发送邮件功能
2017/07/22 Python
Python实现合并同一个文件夹下所有txt文件的方法示例
2018/04/26 Python
利用Python读取txt文档的方法讲解
2018/06/23 Python
Django中使用Celery的教程详解
2018/08/24 Python
python将字符串以utf-8格式保存在txt文件中的方法
2018/10/30 Python
浅析Python 实现一个自动化翻译和替换的工具
2019/04/14 Python
python超时重新请求解决方案
2019/10/21 Python
Pytorch中膨胀卷积的用法详解
2020/01/07 Python
关于pycharm 切换 python3.9 报错 ‘HTMLParser‘ object has no attribute ‘unescape‘ 的问题
2020/11/24 Python
Weekendesk意大利:探索多种引人入胜的周末主题
2016/10/14 全球购物
意大利自行车商店:Cingolani Bike Shop
2019/09/03 全球购物
美术学专业求职信
2014/07/23 职场文书
查摆问题整改措施
2014/10/24 职场文书
56句经典英文座右铭
2019/08/09 职场文书
Flutter Navigator 实现路由传递参数
2022/04/22 Java/Android