1

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に対してdisplayをnoneに設定します。表示されている場合は、次のビットで処理されるため、何も実行されません。矢印の画像が変化するdivの直後にも同様のルールがあります。次に、divが表示されていない場合は、「block」に設定するか、「none」に設定します。これにより、他のメニューdivを開閉せずに1つのメニューdivを開閉できます。

onclick関数によって収集されたIDを使用して、関数の上部にある変数の下部に表示されているように、異なるIDを持つdivを制御しています。おそらく、これはIEが扱いやすくなっているところです。

どんな助けでも大歓迎です。

4

3 に答える 3

3

要素で、IDを引用符で囲んでみてください。

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

また、JavaScriptの「アラート」関数を使用して、IEでデータがどのように表示されるかを確認することもできます。

alert(selectedDD); 
于 2012-11-26T19:29:46.367 に答える
1

getElementsByClassName IE8以下ではサポートされていません。

完全なライブラリを使用したくない場合は、IE8以下の互換性に対するJonathanSnookのアプローチを試すことができます。

于 2012-11-26T19:33:42.090 に答える
0

のID<div id="1" ..は有効ではありません:

IDトークンとNAMEトークンは、文字([A-Za-z])で始まる必要があり、その後に任意の数の文字、数字([0-9])、ハイフン( "-")、アンダースコア( "_")を続けることができます。 、コロン( ":")、およびピリオド( "。")。

#a1問題の原因となる可能性があるため、有効なもの(例)に変更してみてください。

于 2012-11-26T19:28:37.247 に答える