未捕獲TypeError：無法讀取undefined屬性'classList'

我正在試圖爲js上的我的網站做簡單的滑塊，但是我遇到了問題。未捕獲TypeError：無法讀取undefined屬性'classList'

我有變量「我」，我不能使用它。

你可以在我的代碼中看到。

這個問題的解決方案是什麼？

var slider = []; 
    var radio = []; 

for (var i = 1; document.querySelector('.radio-' + i) !== null; i++) { //this variable 

radio[i] = document.querySelector('.radio-' + i); 
radio[i].addEventListener('click', function() { 
    for (var u = 1; document.querySelector('.slider' + u) !== null; u++) { 
     slider[u] = document.querySelector('.slider' + u); 

     if (slider[u].classList.contains('slider-show')) { 
      slider[u].classList.remove('slider-show'); 
     } 
    } 
    slider[i].classList.add('slider-show'); //want to use here 
}); 
}

來源

2016-09-14 lupti_du

的可能的複製[JavaScript的閉包內環路 - 簡單實用的例子（http://stackoverflow.com /問題/ 750486/JavaScript的閉合內部 - 環 - 簡單實用-示例） – Xufox

一在ES5你需要有收音機和滑塊之間有着某種聯繫，我的建議是，例如data-i在無線電數據屬性和滑塊相同的屬性。您的問題線路如下所示：

slider[this.dataset.i].classList.add('slider-show');

收音機和滑塊都需要有data-i屬性。所以收音機1有data-i="1"，滑塊1有data-i="1"。

二，在ES5你也可以使用匿名函數與自己的變量範圍

for (var i = 1; document.querySelector('.radio-' + i) !== null; i++)  { 

function(i){ 

    //here rest of code with addEventListener 
    //i is scope variable so it will work as supposed 

}(i); 

}

III。在ES6中聲明i爲塊變量，所以在for循環中使用let i而不是var i。

來源

2016-09-14 16:27:48

您的問題的原因是var我點擊其中一個單選按鈕時設置爲您的循環的最後一個索引。

跟蹤值Ia你必須使用一個封閉的偵聽器定義的時間：

var listener = (function (i) { 

    return function(evt){ 

    for (var u = 1; document.querySelector('.slider' + u) !== null; u++) { 
     slider[u] = document.querySelector('.slider' + u); 

     if (slider[u].classList.contains('slider-show')) { 
      slider[u].classList.remove('slider-show'); 
     } 
    } 
    slider[i].classList.add('slider-show'); 
    } 
})(i); 

radio[i].addEventListener('click', listener);

來源

2016-09-14 16:58:50 OBDM

未捕獲TypeError：無法讀取undefined屬性'classList'

回答

相關問題