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 相关文章推荐
JavaScript中Object和Function的关系小结
Sep 26 Javascript
javaScript矢量图表库-gRaphael几行代码实现精美的条形图/饼图/点图/曲线图
Jan 09 Javascript
JQueryEasyUI datagrid框架的进阶使用
Apr 08 Javascript
jQuery实现鼠标可拖动调整表格列宽度
May 26 Javascript
js获取域名的方法
Jan 27 Javascript
javascript经典特效分享 手风琴、轮播图、图片滑动
Sep 14 Javascript
vue项目中使用vue-i18n报错的解决方法
Jan 13 Javascript
浅谈Vue页面级缓存解决方案feb-alive(上)
Apr 14 Javascript
微信小程序如何利用getCurrentPages进行页面传值
Jul 01 Javascript
layer弹出层自适应高度,垂直水平居中的实现
Sep 16 Javascript
element-ui table行点击获取行索引(index)并利用索引更换行顺序
Feb 27 Javascript
微信小程序组件生命周期的踩坑记录
Mar 03 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
php 什么是PEAR?(第二篇)
2009/03/19 PHP
ajax+php打造进度条代码[readyState各状态说明]
2010/04/12 PHP
php根据日期显示所在星座的方法
2015/07/13 PHP
Laravel 读取 config 下的数据方法
2019/10/13 PHP
弹出广告特效代码(一个IP只弹出一次)
2007/05/11 Javascript
Lazy Load 延迟加载图片的jQuery插件中文使用文档
2012/10/18 Javascript
javascript控制Div层透明属性由浅变深由深变浅逐渐显示
2013/11/12 Javascript
jQuery实现数秒后自动提交form的方法
2015/03/05 Javascript
js正则表达式注册页面表单验证
2016/10/11 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
2017/06/04 Javascript
JS实现的随机排序功能算法示例
2017/06/09 Javascript
javascript中toFixed()四舍五入使用方法详解
2018/09/28 Javascript
浅析Vue.js中v-bind v-model的使用和区别
2018/12/04 Javascript
在Angular中实现一个级联效果的下拉框的示例代码
2020/05/20 Javascript
跟老齐学Python之有容乃大的list(1)
2014/09/14 Python
在Python的while循环中使用else以及循环嵌套的用法
2015/10/14 Python
Ubuntu下创建虚拟独立的Python环境全过程
2017/02/10 Python
Python3之读取连接过的网络并定位的方法
2018/04/22 Python
python实现键盘输入的实操方法
2019/07/16 Python
python 抓包保存为pcap文件并解析的实例
2019/07/23 Python
Python中logging日志库实例详解
2020/02/19 Python
Python数据相关系数矩阵和热力图轻松实现教程
2020/06/16 Python
css3强大的动画效果animate使用说明及浏览器兼容介绍
2013/01/09 HTML / CSS
俄罗斯运动、健康和美容产品在线商店:Lactomin.ru
2020/07/23 全球购物
Linux中如何用命令创建目录
2016/12/02 面试题
暑期实践思想汇报
2014/01/06 职场文书
高一物理教学反思
2014/01/24 职场文书
面试后感谢信怎么写
2014/02/01 职场文书
承诺保证书格式
2015/02/28 职场文书
食品质检员岗位职责
2015/04/08 职场文书
施工员岗位职责范本
2015/04/11 职场文书
小学生暑假安全公约
2015/07/14 职场文书
超市啤酒狂欢夜策划方案范文!
2019/07/03 职场文书
Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件
2021/04/17 Vue.js
浅谈Python中的正则表达式
2021/06/28 Python
MutationObserver在页面水印实现起到的作用详解
2022/07/07 Javascript