我不知道为什么当我将它放在函数中时内部 HTML 不起作用,但当我在我的控制台中尝试相同时它工作正常。
这是我的代码。 (这是为了字符数。)
for (var i = 0; i < document.getElementsByClassName("input-content").length; i++) {
document.getElementsByClassName("input-content")[i].onkeyup = function () {
console.log(this);
var text_max = 99;
var text_length = this.value.length;
var text_remaining = text_max - text_length;
document.getElementsByClassName("character-count")[i].innerHTML = "Character count:" + text_length + "/" + text_max;
}
}
我的 HTML
<textarea type="text" class="input-content"></textarea>
<p class="character-count"></p>
我知道这可能是我错过的一些愚蠢的事情。
PS:我正在寻找纯 JavaScript 的答案。请不要推荐 jQuery。
更新:当我不使用 onkeyup 事件但计数不增加时它工作正常
for(var i=0; i<document.getElementsByClassName("input-content").length;i++)
{
var text_max = 99;
var text_length = document.getElementsByClassName("input-content")[i].value.length;
var text_remaining = text_max - text_length;
document.getElementsByClassName("character-count")[i].innerHTML="Character count:" +text_length+"/"+text_max;
}
最佳答案
您可以为索引使用闭包:
for (var i = 0; i < document.getElementsByClassName("input-content").length; i++) {
document.getElementsByClassName("input-content")[i].onkeyup = function (i) {
return function () {
console.log(this);
var text_max = 99;
var text_length = this.value.length;
var text_remaining = text_max - text_length;
document.getElementsByClassName("character-count")[i].innerHTML = "Character count:" + text_length + "/" + text_max;
};
}(i);
}
<textarea type="text" class="input-content"></textarea>
<p class="character-count"></p>
关于javascript - 如何使用javascript计算textarea中输入字符的数量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36641430/