js限制textarea每行输入字符串长度的代码


Posted in Javascript onOctober 31, 2012

但是textarea没有这个属性。

asp.net的服务端textbox这个属性也不起效,所以我们只有用js脚本来控制
好,废话不多说,先上代码

javascipt源码:

function textCounter(field, maxlimit, lines) {//参数说明:field是textarea对象,maxlimit是最大允许长度,lines是行数 
var arr = field.value.split("\n");//首先我们要为验证行数,通过分行符“\n” 
var perLine = ""; 
var value = ""; 
if (arr.length < lines) lines = arr.length;//判断行数是否超出了我们规定的行数,如果超了就把行数改为超出的,因为我们要算字符串长度 
for (loop = 0; loop < lines; loop++) {//循环测数字符串总长度,不多说了 
perLine = arr[loop]; 
if (perLine.length > maxlimit) 
perLine = perLine.substring(0, maxlimit); 
value = value + perLine; 
if (loop != lines - 1) 
value = value + "\n"; 
} 
if (field.value != value) 
field.value = value; 
if (checkstr(value, maxlimit)) {//判断字符串长度是不是超标 
field.value = value.substring(0, maxlimit);//删除超除的多余字符串 
} 
} function showOverWords(obj, maxlength) {//显示剩余的可输入字符数obj为txteara对象,maxlength最大长度 
len = obj.value.length; 
$("#wordCount").html(maxlength - len); //这句是jquery的,可以自己相对自己改改。 表示修改id为wordCount标签的值 
} 
function checkstr(str, digit) {//判断中文和英文,字符串的长度是否超标 
var n = 0; 
for (i = 0; i < str.length; i++) { 
var leg = str.charCodeAt(i);//ASCII码 
if (leg > 255) {//大于255的都是中文 
n += 2;//如果是中文就是2个字节 
} else { 
n += 1;//英文,不多说了 
} 
} 
if (n > digit) { 
return true; 
} else { 
return false; 
} 
}

ok上面有三个函数,我们通过调用这三个函数就可以实现我们所想要的功能

Javascript 相关文章推荐
addEventListener()第三个参数useCapture (Boolean)详细解析
Nov 07 Javascript
JS批量修改PS中图层名称的方法
Jan 26 Javascript
Javascript this 关键字 详解
Oct 22 Javascript
在jQuery中处理XML数据的大致方法
Aug 14 Javascript
整理Javascript基础入门学习笔记
Nov 29 Javascript
js轮播图的插件化封装详解
Jul 17 Javascript
vue cli使用绝对路径引用图片问题的解决
Dec 06 Javascript
js循环map 获取所有的key和value的实现代码(json)
May 09 Javascript
解决vue select当前value没有更新到vue对象属性的问题
Aug 30 Javascript
VueCli3.0中集成MockApi的方法示例
Jul 05 Javascript
Javascript var变量删除原理及实现
Aug 26 Javascript
JavaScript 定时器详情
Nov 11 Javascript
JS TextArea字符串长度限制代码集合
Oct 31 #Javascript
JS 控件事件小结
Oct 31 #Javascript
jQuery事件 delegate()使用方法介绍
Oct 30 #Javascript
fancybox modal的完美解决(右上的X)
Oct 30 #Javascript
基于jquery自己写tab滑动门(通用版)
Oct 30 #Javascript
基于jquery的滚动条滚动固定div(附演示下载)
Oct 29 #Javascript
使用jquery动态加载javascript以减少服务器压力
Oct 29 #Javascript
You might like
探讨Smarty中如何获取数组的长度以及smarty调用php函数的详解
2013/06/20 PHP
ThinkPHP3.1的Widget新用法
2014/06/19 PHP
PHP实现QQ登录的开原理和实现过程
2018/02/04 PHP
Jquery实现显示和隐藏的4种简单方式
2013/08/28 Javascript
JavaScript解析json格式数据简单示例
2014/12/09 Javascript
JavaScript实现重置表单(reset)的方法
2015/04/02 Javascript
第九章之路径分页标签与徽章组件
2016/04/25 Javascript
微信小程序 数据绑定详解及实例
2016/10/25 Javascript
jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码
2016/12/05 Javascript
在 Angular2 中实现自定义校验指令(确认密码)的方法
2017/01/23 Javascript
JS实现的简单下拉框联动功能示例
2018/05/11 Javascript
微信小程序五子棋游戏AI实现方法【附demo源码下载】
2019/02/20 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
微信小程序云开发使用方法新手初体验
2019/05/16 Javascript
layui插件表单验证提交触发提交的例子
2019/09/09 Javascript
小程序实现锚点滑动效果
2019/09/23 Javascript
jQuery实现的解析本地 XML 文档操作示例
2020/04/30 jQuery
[05:29]2014DOTA2国际邀请赛 赛后专访:LGDNewbee顺利过关
2014/07/13 DOTA
python脚本实现查找webshell的方法
2014/07/31 Python
python中实现字符串翻转的方法
2018/07/11 Python
带你认识Django
2019/01/15 Python
Python3删除排序数组中重复项的方法分析
2019/01/31 Python
Python数据类型之List列表实例详解
2019/05/08 Python
为什么说Python可以实现所有的算法
2019/10/04 Python
美国高级工作服品牌:Carhartt
2018/01/25 全球购物
德国咖啡批发商:Coffeefair
2019/08/26 全球购物
Made in Design英国:设计家具、照明、家庭装饰和花园家具
2019/09/24 全球购物
师范应届毕业生自荐信
2013/11/18 职场文书
旅游个人求职信范文
2014/01/30 职场文书
退伍老兵事迹材料
2014/01/31 职场文书
《夜晚的实验》教学反思
2014/02/19 职场文书
公司委托书怎么写
2014/08/02 职场文书
2014年银行员工工作总结
2014/11/12 职场文书
2014年调度员工作总结
2014/11/19 职场文书
2015年科研工作总结范文
2015/05/13 职场文书
网络安全倡议书(3篇)
2019/09/18 职场文书