input输入框限制中文汉字只能输入20个字符，英文10个字符！

iput输入框限制中文汉字只能输入10个字符，英文20个字符！

产品提了一个需求，要求输入框输入汉字的时候只能输入10个汉字英文的话只能输入20个，当时不知道怎么做，后来通过百度查找到了答案。

@input绑定limitLength方法

limitLength(e) {let value = e.detail.valueconst split = value.split('');//判断一段文字里面有几个汉字跟英文const map = split.map((s, i) => {return (value.charCodeAt(i) >= 0 && value.charCodeAt(i) <= 128) ? 1 : 2;});//计算数组相加的综合let charLength = map.length > 0 && map.reduce((accumulator, currentValue, index) => {const count = accumulator +A currentValue;return count});//判断长度是否大于20 大于20调用字节截取if (charLength <= 20) {this.newData.name = value} else {//使用setTimeout方法异步修改input的值 直接修改不起作用setTimeout(() => {//调用字节截取内容的方法修改输入框的值this.newData.name = this.reBytesStr(this.newData.name, 20)}, 10)}},//通过字节截取字符串/*** @param {String} str //要截取的字符串* @param {Number} len //要截取的长度*/reBytesStr(str, len) {if ((!str && typeof(str) != 'undefined')) {return '';}var num = 0;var str1 = str;var str = '';for (var i = 0, lens = str1.length; i < lens; i++) {num += ((str1.charCodeAt(i) > 255) ? 2 : 1);if (num > len) {break;} else {str = str1.substring(0, i + 1);}}return str;}

以上就是我的解决方法。
补充：uni-app 设置maxlength 用户用手机自带输入法会在输入拼音的时候就导致无法打出完整的字。控制用户输入的长度也可以用这种方式，或者在提交按钮的时候校验字符长度

input输入框限制中文汉字只能输入20个字符，英文10个字符！相关推荐

ubuntu 20.04 安装好搜狗输入法无法输入中文，只能输入英文的问题，因为没有安装依赖
ubuntu 20.04 安装好搜狗输入法无法输入中文,只能输入英文的问题. 在搜狗官网下载了搜狗输入法sogoupinyin_3.4.0.9700_amd64.deb, 使用命令 sudo dpkg ...
解决 input 输入框在中文输入法下的 bug
最近本山人在项目的开发过程中遇到这么一个问题: 在列表中嵌入antd的Input输入框,切换到微软输入法输入时,就不能成功输入中文字符,然而搜狗输入法又是正常的. 研究一番,发现是input的valu ...
解决React中input输入框在中文输入法下的bug
解决React 中input 输入框在中文输入法下的bug 需求:封装Input 组件,输入拼音过程中不触发onChange,拼音输入结束后触发onChange 原理:input 标签上面有两个事件, ...
input的onchange事件及只能输入数字实现
2019独角兽企业重金招聘Python工程师标准>>> <input type="text" class="currentPage"&g ...
react根据中文获取拼音_解决 React 中的 input 输入框在中文输入法下的 bug
以下会涉及到的技术点:react mobx compositionstart compositionupdate compositionend 问题描述在使用 input 时,通常会对输入的内容做校 ...
Android 输入框（EditText）的输入限制，数字英文邮箱，可见\隐藏切换，踩过的坑！
目录一.输入框的输入限制 1.在xml文件里通过设置属性限制输入 2.在代码里动态设置输入限制二.密码可见性切换和遇到的坑最近做到了登录注册模块的各种输入判定,监听等等,因为需求上的需要,还是搞 ...
WPS在中文状态下输入的标点符号为英文的问题
wps在中文状态下输入标点符号时,一直显示英文标点,切换中英文仍然出现改问题, 方法:按住"CTRL+.",即可输入中文标点哦!
Qt实用技巧：实用掩码限制QLineEdit只能输入规定长度的数字、字母和字符
若该文为原创文章,转载请注明原文出处本文章博客地址:https://blog.csdn.net/qq21497936/article/details/113030404 长期持续带来更多项目与技术分 ...
java 汉字字母_JAVA获取中文汉字字符串拼音首字母，英文字符不变的工具类
java在处理项目需求时,有时需要排序,尤其是中文名字按0-9,A-Z进行首字母排序,这时候就需要首先要得到中文字符串的首字母,然后按照字母顺序进行排序,不多说,直接上代码,看java如何获取中文字符 ...

input输入框限制中文汉字只能输入20个字符，英文10个字符！

iput输入框限制中文汉字只能输入10个字符，英文20个字符！

input输入框限制中文汉字只能输入20个字符，英文10个字符！相关推荐

最新文章

热门文章