JS限制文本框录入长度（支持字符限制）

最新推荐文章于 2022-02-26 12:47:00 发布

civerb

最新推荐文章于 2022-02-26 12:47:00 发布

阅读量8.7k

点赞数

分类专栏： JS 文章标签： function 输入法 input

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/civerb/article/details/4772007

版权

JS 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

功能/特点：

1.实时显示可输入的字数（字节数）

2.两种限制方式（长度、字节数）

3.中文输入法下可正常使用，无BUG

4.同一页面可以使用多个，相互不干扰

limit.js

function limit(){ var txtNote;//文本框 var txtLimit;//提示字数的input var limitCount;//限制的字数 var isbyte;//是否使用字节长度限制（1汉字=2字符） var txtlength;//到达限制时，字符串的长度 var txtByte; this.init=function(){ txtNote=this.txtNote; txtLimit=this.txtLimit; limitCount=this.limitCount; isbyte=this.isbyte; txtNote.οnkeydοwn=function(){wordsLimit()};txtNote.οnkeyup=function(){wordsLimit()}; txtLimit.value=limitCount; } function wordsLimit(){ var noteCount=0; if(isbyte){noteCount=txtNote.value.replace(/[^/x00-/xff]/g,"xx").length}else{noteCount=txtNote.value.length} if(noteCount>limitCount){ if(isbyte){ txtNote.value=txtNote.value.substring(0,txtlength+Math.floor((limitCount-txtByte)/2)); txtByte=txtNote.value.replace(/[^/x00-/xff]/g,"xx").length; txtLimit.value=limitCount-txtByte; }else{ txtNote.value=txtNote.value.substring(0,limitCount); txtLimit.value=0; } }else{ txtLimit.value=limitCount-noteCount; } txtlength=txtNote.value.length;//记录每次输入后的长度 txtByte=txtNote.value.replace(/[^/x00-/xff]/g,"xx").length; } }

页面调用：

<html> <body> <input id="txtNote" /> 还可输入<input type="text" id="txtCount" />个字符 </body> <mce:script type="text/javascript"></mce:script> </html>

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
3
评论
JS限制文本框录入长度（支持字符限制）

功能/特点：1.实时显示可输入的字数（字节数）2.两种限制方式（长度、字节数）3.中文输入法下可正常使用，无BUG4.同一页面可以使用多个，相互不干扰limit.jsfunction limit(){ var txtNote;//文本框 var txtLimit;//提示字数的input var limitCount;//限制的字数 var isbyte;
复制链接

扫一扫

专栏目录

评论 3

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。