在js中input 怎么实现输入框只能输入2个中文以及1个英文字符?
时间: 2023-05-30 08:06:17 浏览: 731
可以通过监听输入事件,在输入框中输入内容时进行限制。具体实现如下:
```html
<input type="text" id="input" maxlength="3">
```
```javascript
var inputEl = document.getElementById('input');
inputEl.addEventListener('input', function() {
var value = inputEl.value;
var len = value.length;
var cnLen = value.replace(/[^\u4e00-\u9fa5]/g, '').length; // 中文字符个数
var enLen = len - cnLen; // 英文字符个数
if (cnLen > 2 || enLen > 1) {
inputEl.value = value.slice(0, len - 1); // 截取前面的字符串作为新的值
}
});
```
其中,`inputEl`是输入框的DOM元素,通过`addEventListener`方法监听`input`事件。在事件处理函数中,获取输入框的值`value`,计算中文字符个数`cnLen`和英文字符个数`enLen`,如果超出限制,则截取前面的字符串作为新的值。最后,将新的值重新赋值给输入框即可。注意,`maxlength`属性的值应该为3,因为中文字符占用两个字符位置。
阅读全文