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 相关文章推荐
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 Javascript
Javascript 通过json自动生成Dom的代码
Apr 01 Javascript
使用AngularJS和PHP的Laravel实现单页评论的方法
Jun 19 Javascript
JS模仿腾讯图片站的图片翻页按钮效果完整实例
Jun 21 Javascript
详解浏览器渲染页面过程
Feb 09 Javascript
easyui关于validatebox实现多重规则验证的方法(必看)
Apr 12 Javascript
Web开发使用Angular实现用户密码强度判别的方法
Sep 27 Javascript
使用electron制作满屏心特效的示例代码
Nov 27 Javascript
JavaScript模板引擎原理与用法详解
Dec 24 Javascript
记录一次完整的react hooks实践
Mar 11 Javascript
vue实现表格过滤功能
Sep 27 Javascript
Vue的自定义组件不能使用click方法的解决
Jul 28 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
建立动态的WML站点(一)
2006/10/09 PHP
php cli 方式 在crotab中运行解决
2010/02/08 PHP
工厂模式在Zend Framework中应用介绍
2012/07/10 PHP
php连接mssql的一些相关经验及注意事项
2013/02/05 PHP
php使用filter过滤器验证邮箱 ipv6地址 url验证
2013/12/25 PHP
如何正确配置Nginx + PHP
2016/07/15 PHP
你需要知道的10个最佳javascript开发实践小结
2012/04/15 Javascript
js获取或设置当前窗口url参数的小例子
2013/10/14 Javascript
详解javascript数组去重问题
2015/11/06 Javascript
js 自带的 map() 方法全面了解
2016/08/16 Javascript
微信小程序 教程之wxapp视图容器 swiper
2016/10/19 Javascript
JavaScript函数节流和函数防抖之间的区别
2017/02/15 Javascript
详解nodejs微信公众号开发——6.自定义菜单
2017/04/13 NodeJs
js tab栏切换代码实例解析
2019/09/03 Javascript
layui输入框中只允许输入整数的实现方法
2019/09/18 Javascript
使用 Element UI Table 的 slot-scope方法
2019/10/10 Javascript
在vue中使用console.log无效的解决
2020/08/09 Javascript
wxPython使用系统剪切板的方法
2015/06/16 Python
讲解Python的Scrapy爬虫框架使用代理进行采集的方法
2016/02/18 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
Python使用剪切板的方法
2017/06/06 Python
如何使用 Pylint 来规范 Python 代码风格(来自IBM)
2018/04/06 Python
Python实现接受任意个数参数的函数方法
2018/04/21 Python
flask框架实现连接sqlite3数据库的方法分析
2018/07/16 Python
使用Python生成200个激活码的实现方法
2019/11/22 Python
Pytorch实现基于CharRNN的文本分类与生成示例
2020/01/08 Python
python3 自动打印出最新版本执行的mysql2redis实例
2020/04/09 Python
Python打印不合法的文件名
2020/07/31 Python
Python plt 利用subplot 实现在一张画布同时画多张图
2021/02/26 Python
CSS3按钮鼠标悬浮实现光圈效果源码
2016/09/11 HTML / CSS
聪明的粉丝购买门票的地方:TickPick
2018/03/09 全球购物
单位领导证婚词
2014/01/14 职场文书
2015年政治教研组工作总结
2015/07/22 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
2016年艾滋病宣传活动总结
2016/04/01 职场文书
用Python创建简易网站图文教程
2021/06/11 Python