Heim > Fragen und Antworten > Hauptteil
js Eingabefeld begrenzt die Anzahl der Wörter im Eingabefeld, der folgende Code
<input type='text' onkeyup="checkNumber($(this))">
function checkNumber($this){
let val=$this.val();
if(val.length > 10 ){
alert('字数超过10');
}
}
Während des eigentlichen Prozesses wurden folgende Probleme festgestellt, wie im Bild dargestellt:
Bei der Eingabemethode werden zuerst die Buchstaben angezeigt und dann das Pinyin der Buchstaben in chinesische Schriftzeichen umgewandelt. Daher kann es sein, dass bei der Eingabe die Anzahl der Buchstaben plus chinesischer Zeichen die begrenzte Anzahl an Zeichen überschreitet. Wie kann das Problem gelöst werden?
给我你的怀抱2017-07-05 10:40:10
我们设想下,input也输入全英文的、或者中文,需要限定长度小于10,那么maxlength="10"是需要的,checkNumber函数然后判断是否input有存在中文,有的话判断最后字符是否是英文。如果没有中文说明说纯英文就提示,这样方案不足之处有中文和英文一起存在不好判断。
ringa_lee2017-07-05 10:40:10
下面这个例子,不知会不会帮到你
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>input 事件兼容处理以及中文输入法优化</title>
</head>
<body>
<input type='text'>
<script>
var input = document.querySelector('input');
var isLock = false;
//当浏览器有非直接的文字输入时, compositionstart事件会以同步模式触发.
input.addEventListener('compositionstart', function(){
isLock = true;
})
//当浏览器是直接的文字输入时, compositionend会以同步模式触发.
input.addEventListener('compositionend', function(){
isLock = false;
});
input.addEventListener('input',function(e){
if(!isLock)console.log(this.value);
});
</script>
</body>
</html>