JS简单限制textarea内输入字符数量的方法


Posted in Javascript onOctober 14, 2015

本文实例讲述了JS简单限制textarea内输入字符数量的方法。分享给大家供大家参考。具体如下:

这里演示JS限制一个area内的字符不能超过255,多余则截取。

代码如下:

<script> 
function getStringUTFLength(str) { 
 var value = str.replace(/[\u4e00-\u9fa5]/g," ");
 //将汉字替换为两个空格
 return value.length; 
} 
function leftUTFString(str,len) { 
 if(getStringUTFLength(str)<=len) { 
  return str; 
 }
 var value = str.substring(0,len); 
 while(getStringUTFLength(value)>len) { 
  value = value.substring(0,value.length-1); 
 } 
 return value; 
} 
function count() { 
 var len=255;
 var value = document.getElementById("licenseother").value; 
 if(getStringUTFLength(value)>=len) {  
  document.getElementById("licenseother").value = leftUTFString(document.getElementById("licenseother").value,len); 
 } 
 document.getElementById("result").value = len-getStringUTFLength(document.getElementById("licenseother").value); 
} 
</script> 
<table width="100%"> 
 <tr>
  <td> 
   <textarea cols=100 rows=4 id="licenseother" onkeypress="count()" onkeyup="count()" onblur="count();" onChange="count();"></textarea> 
  </td>
 </tr> 
 <tr>
  <td> 
   本输入框限制输入255个字符(汉字计算为2个字符)  剩余字符数:
   <input readonly type="text" size="3" id="result" value="255"> 
  </td>
 </tr> 
</table>

希望本文所述对大家的JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js同时按下两个方向键
Dec 01 Javascript
jquery checkbox,radio是否选中的判断代码
Mar 20 Javascript
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
Mar 27 Javascript
javascript onmouseout 解决办法
Jul 17 Javascript
javascript中方便增删改cookie的一个类
Oct 11 Javascript
javascript实现选中复选框后相关输入框变灰不可用的方法
Aug 11 Javascript
jQuery 获取屏幕高度、宽度的简单实现案例
May 17 Javascript
JS二叉树的简单实现方法示例
Apr 05 Javascript
vue插件vue-resource的使用笔记(小结)
Aug 04 Javascript
vue+express+jwt持久化登录的方法
Jun 14 Javascript
js实现自动播放匀速轮播图
Feb 06 Javascript
vue+axios 拦截器实现统一token的案例
Sep 11 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 #Javascript
浅析四种常见的Javascript声明循环变量的书写方式
Oct 14 #Javascript
浅谈angular.js中实现双向绑定的方法$watch $digest $apply
Oct 14 #Javascript
JS更改select内option属性的方法
Oct 14 #Javascript
JavaScript+CSS实现仿Mootools竖排弹性动画菜单效果
Oct 14 #Javascript
JS实现的最简Table选项卡效果
Oct 14 #Javascript
JS仿淘宝实现的简单滑动门效果代码
Oct 14 #Javascript
You might like
2.PHP入门
2006/10/09 PHP
PHP中对用户身份认证实现两种方法
2011/06/04 PHP
PHP中抽象类、接口的区别与选择分析
2016/03/29 PHP
PHP微信开发之查询微信精选文章
2016/06/23 PHP
仿JQuery输写高效JSLite代码的一些技巧
2015/01/13 Javascript
javascript生成大小写字母
2015/07/03 Javascript
详解maxlength属性在textarea里奇怪的表现
2015/12/27 Javascript
一系列Bootstrap导航条使用方法分享
2016/04/29 Javascript
基于vue cli 通过命令行传参实现多环境配置
2018/07/12 Javascript
微信 jssdk 签名错误invalid signature的解决方法
2019/01/14 Javascript
Easyui 去除jquery-easui tab页div自带滚动条的方法
2019/05/10 jQuery
Vue 自定义标签的src属性不能使用相对路径的解决
2019/09/17 Javascript
vue 验证码界面实现点击后标灰并设置div按钮不可点击状态
2019/10/28 Javascript
Python运行的17个时新手常见错误小结
2012/08/07 Python
python中去空格函数的用法
2014/08/21 Python
为什么选择python编程语言入门黑客攻防 给你几个理由!
2018/02/02 Python
Python爬虫实战:分析《战狼2》豆瓣影评
2018/03/26 Python
对python捕获ctrl+c手工中断程序的两种方法详解
2018/12/26 Python
python基于C/S模式实现聊天室功能
2019/01/09 Python
django基础学习之send_mail功能
2019/08/07 Python
Python实现TCP探测目标服务路由轨迹的原理与方法详解
2019/09/04 Python
Python object类中的特殊方法代码讲解
2020/03/06 Python
CSS3哪些新特性值得称赞
2016/03/02 HTML / CSS
HTML5 progress和meter控件_动力节点Java学院整理
2017/07/06 HTML / CSS
Html5 canvas实现粒子时钟的示例代码
2018/09/06 HTML / CSS
电子专业推荐信范文
2013/11/18 职场文书
教师绩效考核方案
2014/01/21 职场文书
餐厅执行经理岗位职责范本
2014/02/26 职场文书
聚美优品的广告词
2014/03/14 职场文书
教室布置标语
2014/06/26 职场文书
庆国庆活动总结
2014/08/28 职场文书
高一学年自我鉴定范文(3篇)
2014/09/26 职场文书
上课迟到检讨书范文
2015/05/06 职场文书
安全教育片观后感
2015/06/17 职场文书
Golang原生rpc(rpc服务端源码解读)
2022/04/07 Golang
Python Pandas解析读写 CSV 文件
2022/04/11 Python