this.id不工作在ie

Question

我一直在使用JavaScript組合手風琴式的左導航，我遇到了一個問題，下面的代碼在Chrome和Firefox中運行，但在IE中卻不行。

function navClick(clickedDD){
    var numDD = document.getElementsByClassName('navDropdown');
    var numArrow = document.getElementsByClassName('navUnfolded');
    var selectedDD = document.getElementById('dd0' + clickedDD);
    var arrow = document.getElementById('arrow0' + clickedDD);
    if (selectedDD.style.display == 'none') {
        for (var i = numDD.length - 1; i >= 0; i--) {
            numDD[i].style.display = 'none';
        }
    }
    if (arrow.className == 'navFolded') {
        for (var i = numArrow.length - 1; i >= 0; i--) {
            numArrow[i].className = 'navFolded';
        }
    }
    if (selectedDD.style.display == 'none') {
        selectedDD.style.display = 'block';
        arrow.className = 'navUnfolded';
    } else {
        selectedDD.style.display = 'none';
        arrow.className = 'navFolded';
    }
}

我不肯定是什么讓它無法正常運行，但我懷疑這是我在onclick中使用的“this.id”。

<div id="1" onclick="navClick(this.id);">Content</div>

我對JavaScript比較陌生，如果這有助於了解。 基本上，此函數首先查看是否顯示單擊的div，如果沒有，則在繼續之前將所有div的顯示設置為none。 如果顯示，它什么都不做，因為下一位將處理它。 對於具有變化的箭頭圖像的div，之后有類似的規則。 然后，如果沒有顯示div，則將其設置為“阻止”，否則將其設置為“無”，這允許我打開和關閉單個菜單div而無需打開/關閉其他菜單。

我正在使用onclick函數收集的id來控制具有不同id的div，可以在函數頂部的變量底部看到。 也許這就是IE變得敏感的地方。

任何幫助表示贊賞。

Answer 1

在您的元素上，嘗試將ID放在引號中：

<div id = '1' onClick="navClick(this.id);">

您還可以嘗試使用javascript的“警報”功能來查找IE中的數據：

alert(selectedDD); 

Answer 2

IE8或更低版本不支持 getElementsByClassName 。

如果您不想使用完整的庫，可以嘗試使用Jonathan Snook的 IE8及以下兼容性方法。

Answer 3

您在<div id="1" ..不是有效的：

ID和NAME令牌必須以字母（[A-Za-z]）開頭，后面可以跟任意數量的字母，數字（[0-9]），連字符（“ - ”），下划線（“_”） ，冒號（“：”）和句號（“。”）。

所以嘗試將其更改為有效的（例如#a1 ），因為這可能是您的問題的原因。