我試圖將兩個單獨的最大字符欄位添加到表單中沒有成功。我嘗試重命名元素 ID 并更改 var i 和 c 但無濟于事。謝謝
小提琴http://jsfiddle.net/rLkcy0t4/
這是代碼。
var maxchar = 160;
var i = document.getElementById("textinput");
var c = document.getElementById("count");
c.innerHTML = maxchar;
i.addEventListener("keydown", count);
function count(e) {
var len = i.value.length;
if (len >= maxchar) {
e.preventDefault();
} else {
c.innerHTML = maxchar - len - 1;
}
}textarea {
display: block;
width: 200 px;
height: 100 px;
}Remaining characters: <span id="count"></span>
<textarea id="textinput">
</textarea>uj5u.com熱心網友回復：
授權和資料屬性將有所幫助
window.addEventListener("load", function() {
const container = document.getElementById("container")
container.querySelectorAll("textarea").forEach(ta => ta.dataset.max = ta.dataset.cnt); // save
container.addEventListener("input", function(e) {
const tgt = e.target;
if (tgt.matches("textarea")) {
const maxchar = tgt.dataset.max;
let cnt = tgt.dataset.cnt;
const c = tgt.previousElementSibling;
cnt = maxchar - tgt.value.length;
if (cnt < 0) {
tgt.value = tgt.value.slice(0, maxchar);
cnt = 0;
}
tgt.dataset.cnt = cnt;
c.textContent = cnt;
}
})
})textarea {
display: block;
width: 200 px;
height: 100 px;
}<div id="container">
Remaining characters: <span class="count"></span><textarea id="textinput1" data-cnt="160"></textarea>
<hr/> Remaining characters: <span class="count"></span><textarea id="textinput2" data-cnt="100"></textarea>
</div>uj5u.com熱心網友回復：
您的小提琴中的問題是您要宣告多個具有相同名稱的變數。你宣告i和c兩次。您還宣告該函式count兩次。將這些變數中的一半重命名為獨特的名稱，它應該可以按照您的預期作業。
您可以在這個fiddle中看到一個作業示例。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/444645.html