我試圖通過讓 for 回圈索引充當配對機制，將 for 回圈中參考 SVG 圖示的物件陣列連接到匹配內容陣列。兩個陣列的日志都標識了所有相關物件，但是當我呼叫 panel[i] 更改時，我得到那個 panel[i] 是未定義的？acc[i] 似乎在 for 回圈中作業得很好。如何確保 acc[i] 事件偵聽器與其相應的索引位置面板配對，然后控制面板上的 css 將顯示從隱藏更改為阻止？
謝謝！
const acc = document.querySelectorAll(".fas.fa-plus-circle.fa-3x");
const panel = document.querySelectorAll(".panel");
let i;
console.log(acc);
console.log(panel);
for (i = 0; i < acc.length; i ) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
console.log(panel[i]);
if (panel[i].style.display === "block") {
panel[i].style.display = "none";
} else {
panel[i].style.display = "block";
}
});
}
uj5u.com熱心網友回復：
因為你已經i在for回圈外宣告了，所以只有一個i變數，它會變成等于acc.length回圈結束的時候。因此，當您單擊并執行事件處理程式時，該值i不是您想要的。
為了解決這個問題，創建i一個塊范圍的變數：
for (let i = 0; i < acc.length; i ) {
現在回圈的每次迭代都有自己的i變數，該變數將保留其值。會有一個i是0，另一個是1，......等等。結果，事件處理程式將各自訪問i具有預期值的權限。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/404987.html
標籤：