如何解决在输入值之前不会显示最大长度,并且在 Backspacing 之后它会减少到 31 个字符
Max length 的值在加载时为 30,所有字符退格后为 30。
<input onkeypress="chars(),maxLen()" onkeydown="back()" maxlength="30" type="text" placeholder="Title....." id="inpuT1" class="input">
<br>
Max Length <span id="chars"></span>
此外,我必须在中途给出两个输入或两个退格来更改值。我需要它就像 Stackoverflow 问题框一样,上面写着“x”个字符。
//Maximum input length
document.getElementById("chars").innerHTML=result;
function chars(){
var inputValue = document.getElementById("inpuT1").value;
var textnode = document.createTextNode(inputValue);
var maxlen = 30;
var result;
result=maxlen-textnode.length;
document.getElementById("chars").innerHTML=result;
}
//Key down
function back(){
var inputValue = document.getElementById("inpuT1").value;
var textnode = document.createTextNode(inputValue);
var maxlen=30;
var result;
result=maxlen-textnode.length;
document.getElementById("chars").innerHTML=result+1;
}
//Maximum input length
function maxLen(){
var inputValue = document.getElementById("inpuT1").value;
var textnode = document.createTextNode(inputValue);
if(textnode.length>29){
alert("Max Length reached !!!");
}
}
解决方法
inpuT1.addEventListener(
'keyup',({ target: { value: { length } } }) => {
console.log(length)
chars.innerText = 30 - length
}
)
<input maxlength="30" type="text" placeholder="Title....." id="inpuT1" class="input">
<br>
Characters left: <span id="chars"></span>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。