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 相关文章推荐
JavaScript 原型学习总结
Oct 29 Javascript
Javascript限制网页只能在微信内置浏览器中访问
Nov 09 Javascript
tuzhu_req.js 实现仿百度图片首页效果
Aug 11 Javascript
jQuery实现的漂亮表单效果代码
Aug 18 Javascript
JS简单模拟触发按钮点击功能的方法
Nov 30 Javascript
jQuery实现图片加载完成后改变图片大小的方法
Mar 29 Javascript
JQuery 在文档中查找指定name的元素并移除的实现方法
May 19 Javascript
jQuery 常见小例汇总
Dec 14 Javascript
第一次记录Bootstrap table学习笔记(1)
May 18 Javascript
easyui datagrid 表格中操作栏 按钮图标不显示的解决方法
Jul 27 Javascript
JavaScript使用math.js进行精确计算操作示例
Jun 19 Javascript
Vue Extends 扩展选项用法完整实例
Sep 17 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
[原创]php使用curl判断网页404(不存在)的方法
2016/06/23 PHP
PHP的PDO事务与自动提交
2019/01/24 PHP
几行代码轻松搞定jquery实现flash8类似的连接效果
2007/05/03 Javascript
jquery动画4.升级版遮罩效果的图片走廊--带自动运行效果
2012/08/24 Javascript
mailto的使用技巧分享
2012/12/21 Javascript
使图片旋转的3种解决方案
2013/11/21 Javascript
Jquery遍历节点的方法小集
2014/01/22 Javascript
深入分析Cookie的安全性问题
2015/03/01 Javascript
jquery控制表单输入框显示默认值的方法
2015/05/22 Javascript
jquery获取复选框checkbox的值实现方法
2016/05/30 Javascript
Vue.js实现拖放效果的实例
2016/09/30 Javascript
微信浏览器禁止页面下拉查看网址实例详解
2017/06/28 Javascript
详解vue-cli 脚手架 安装
2019/04/16 Javascript
layui给下拉框、按钮状态、时间赋初始值的方法
2019/09/10 Javascript
微信小程序实现侧边栏分类
2019/10/21 Javascript
JavaScript实现随机点名程序
2020/03/25 Javascript
python的socket编程入门
2018/01/29 Python
python生成器,可迭代对象,迭代器区别和联系
2018/02/04 Python
Pycharm 设置自定义背景颜色的图文教程
2018/05/23 Python
python得到电脑的开机时间方法
2018/10/15 Python
强悍的Python读取大文件的解决方案
2019/02/16 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
GitHub 热门:Python 算法大全,Star 超过 2 万
2019/04/29 Python
美国知名的隐形眼镜电商:Contacts America
2019/11/19 全球购物
舞蹈教师自荐信
2014/01/27 职场文书
汽车检测与维修专业求职信
2014/07/04 职场文书
幼儿园家长安全责任书
2014/07/22 职场文书
我们的节日端午节活动总结
2015/02/11 职场文书
写给女朋友的保证书
2015/05/09 职场文书
太空授课观后感
2015/06/17 职场文书
培训后的感想
2015/08/07 职场文书
运动会广播稿20字
2015/08/19 职场文书
2016教师学习党章心得体会
2016/01/15 职场文书
导游经典开场白——导游词
2019/04/17 职场文书
原生Js 实现的简单无缝滚动轮播图的示例代码
2021/05/10 Javascript
React配置子路由的实现
2021/06/03 Javascript