实现textarea限制输入字数(包含中文只能输入10个,全ASCII码能够输入20个)

textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到。与单行文本框text控件不同,它不能通过maxlength属性来限制字数,为此必须寻求其他方法来加以限制以达到预设的需求。

通常的做法就是使用#脚本语言来实现对textarea文本域的字数输入限制,简单而实用。假设我们有一个id为 txta1 的textarea文本区,我们可以通过以下代码限制它的键盘输入字数为10个字(汉字或其他小角字符):

<script language="#" type="text/ecmascript">

window.onload = function()

{

document.getElementById('txta1').onkeydown = function()

{

if(this.value.length >= 10)

event.returnValue = false;

}

}

</script>

它的原理是通过对keydown(键盘键位按下)事件对指定id号的文本区进行监测,可以想象,它只能限制键盘输入,如果用户通过鼠标右键粘贴剪切板中的文本,它无法控制字数。

通过键盘输入,以上文本区只能输入10个字。但是,我们的目的并没有达到!请随便复制一些文本,试着用鼠标右键粘贴,看看发生了什么。

你可以在网上找到类似上述的其他JS脚本,它们不管多么优秀,其原理都是一样的,通过对keydown、keyup或keypress之类的键盘键位操作事件来监控文本区的输入,无法防止鼠标右键的粘贴,为此,如果一定要真正地限制textarea的字数,我们还得为网页加另一把锁——禁用鼠标右键,这无疑得付出额外的开销,同时也可能是网页制作者不一定愿意做的。其实,还有一个更简单的方法,使用onpropertychange属性。

onpropertychange可以用来判断预定元素的value值,当元素的value值发生变化时判断事件就会被触发,仅关心被监测元素的value值,避开了输入的来源,从而可以比较理想地达成我们的限制字数这一目的。它属于JS范畴,可以在表单方框区代表中嵌套使用,以下是代码和效果样式,可以像上面那样测试输入,你会发现它真正达到目的:不管用什么方式输入,它只能输入100个字(汉字或其他小解符号):

代码:

当然,为了更为保险,处理表单数据的后台脚本程序还应该对提交来的数据进行再一次的检测,如果字数超出预设的数量则进行相应处理,这样才达到真正限制字数的目的。(完)

另外一种方法实现textarea限制输入字数(包含中文只能输入10个,全ASCII码能够输入20个)

function check() {

var regC = /[^ -~]+/g;

var regE = /\D+/g;

var str = t1.value;

if (regC.test(str)){

t1.value = t1.value.substr(0,10);

}

if(regE.test(str)){

t1.value = t1.value.substr(0,20);

}

}

还有一种方式:

function textCounter(field, maxlimit) {

if (field.value.length > maxlimit){

field.value = field.value.substring(0, maxlimit);

}else{

document.upbook.remLen.value = maxlimit - field.value.length;

}

}

textarea>

剩余字数:

function LimitTextArea(field){

maxlimit=200;

if (field.value.length > maxlimit)

field.value = field.value.substring(0, maxlimit);

}

title="The textarea width must less than 300 characters." 放在textarea 里面提示输入最大字节数。

例如:

从网上摘抄来的,希望对大家有帮助哦~~

texearea 限制字数_实现textarea限制输入字数相关推荐

  1. texearea 限制字数_限制textarea的输入字数

    今天接到任务的第一个需求是限制字数,查看了一下之前人留下来的代码,使用的是textarea,于是就想当然的用了maxlength,结果发现无用.查阅得知,原来textarea对于maxlength的支 ...

  2. texearea 限制字数_js实现textarea限制输入字数

    实现textarea限制输入字数(包含中文只能输入10个,全ASCII码能够输入20个) textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框t ...

  3. html 实时计算字数,JavaScript 实现textarea限制输入字数, 输入框字数实时统计更新,输入框实时字数计算移动端bug解决...

    textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框text控件不同,它不能通过maxlength属性来限制字数,为此必须寻求其他方法来加以限制 ...

  4. 实现textarea限制输入字数

    2019独角兽企业重金招聘Python工程师标准>>> textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框text控件不同, ...

  5. textarea html5限制字数,textarea文字输入字数限制

    textarea文字输入字数限制,不超300 300 function checkLen(obj) { var maxChars = 300;//最多字符数 if (obj.value.length  ...

  6. JavaScript 实现textarea限制输入字数, 输入框字数实时统计更新,输入框实时字数计算移动端bug解决...

    textarea称文本域,又称文本区,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到.与单行文本框text控件不同,它不能通过maxlength属性来限制字数,为此必须寻求其他方法来加以限制 ...

  7. element ui textarea实现输入字数统计

    背景 最近看同行设计,input textarea如果限制字符,可以展示已输入多少个字符,总共限制多少个字符.觉得这个设计挺好,看了一下element官方文档,也可以这么实现. 具体实现 maxlen ...

  8. JS 限制input框的输入字数,并提示可输入字数

    <!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8" ...

  9. 怎么用python统计字数_使用Python 统计高频字数的方法

    问题 (来自Udacity机器学习工程师纳米学位预览课程) 用 Python 实现函数 count_words(),该函数输入字符串 s 和数字 n,返回 s 中 n 个出现频率最高的单词.返回值是一 ...

最新文章

  1. 嵌入式控制系统和计算机系统
  2. 欢乐纪中B组周六赛【2019.3.9】
  3. 【牛客 - 370 I 】Rinne Loves Xor(按位前缀和,异或)
  4. 浙江义乌计算机中专学校,浙江义乌有没有中专学校?
  5. [Unity][FlowCanvas][NodeCanvas] ForEach 不适合连接 Wait,FSM 的 SubFlowScript 接受不到事件
  6. python IO多路复用之select
  7. 安卓自定义控件,自行绘制文字
  8. R语言将数据框中的字符类型数字转换为数值
  9. Python 100 例 练习实例1
  10. 腾讯手机管家android版,腾讯手机管家上线Android8.11.0版本
  11. 出现老是弹出Visual Studio 实时调试器 的问题
  12. T32 连接PLC与调试器,使用python可以操纵调试器
  13. oracle12c 重启服务,OBIEE12c的服务启动/关闭命令
  14. 心血来潮用vb写-音标发音小程序
  15. 人工神经网络的应用实例,人工神经网络简单例题
  16. 点到点轨迹规划——三次曲线,五次曲线,梯形曲线,S曲线
  17. 为什么linux不需要整理磁盘,为什么Linux不需要磁盘碎片整理
  18. fluent中网格检查
  19. 什么是SQL触发器?SQL触发器是什么意思?
  20. HTML侧面导航栏效果

热门文章

  1. XMind思维导图教程——思维导图怎么画?
  2. EXCEL 十进制角度转换为度分秒格式
  3. iOS11.0后APP的图标和启动图
  4. 星域CDN荣获2016“最值得信赖CDN解决方案奖”
  5. Python 人机对战游戏
  6. 自洁式排气水过滤器工作原理
  7. 百度李彦宏登上《时代周刊》整个互联网都在比心
  8. idea设置默认谷歌浏览器为无痕浏览
  9. 期望值、均值(一阶矩)、方差(二阶中心距)、标准差
  10. java 判断是否为邮箱_java如何判断邮箱是否合法