IEで動作するようにshow-hideスクリプトを変更する

Question

このスクリプトを使用して、ページのメニューセクションを表示/非表示にしていますが、Internet Explorerでは動作しません。 IE上で動作するようにコードを変更するにはどうすればよいですか？

これはJqueryでより簡単にトグル機能を使って行うことができると思いますが、私は同じ構造を維持したいと思います。

visibleDiv1 = ""; 
visibleDiv2 = ""; 
visibleDiv3 = ""; 
visibleDiv4 = ""; 

function showHide1(elementid1){ 
    if (document.getElementById(elementid1).style.display == 'none'){ 
    document.getElementById(elementid1).style.display = ''; 
    if(visibleDiv1 != ""){ 
     if(visibleDiv1 != elementid1){ 
     document.getElementById(visibleDiv1).style.display = 'none'; 
     } 
    } 
    visibleDiv1 = elementid1; 
    } else { 
    document.getElementById(elementid1).style.display = 'none'; 

    } 
} 

function showHide2(elementid2){ 
    if (document.getElementById(elementid2).style.display == 'none'){ 
    document.getElementById(elementid2).style.display = ''; 
    if(visibleDiv2 != ""){ 
     if(visibleDiv2 != elementid2){ 
     document.getElementById(visibleDiv2).style.display = 'none'; 
     } 
    } 
    visibleDiv2 = elementid2; 
    } else { 
    document.getElementById(elementid2).style.display = 'none'; 
    } 
} 

function showHide3(elementid3){ 
    if (document.getElementById(elementid3).style.display == 'none'){ 
    document.getElementById(elementid3).style.display = ''; 
    if(visibleDiv3 != ""){ 
     if(visibleDiv3 != elementid3){ 
     document.getElementById(visibleDiv3).style.display = 'none'; 
     } 
    } 
visibleDiv3 = elementid3; 
    } else { 
    document.getElementById(elementid3).style.display = 'none'; 
    } 
} 

function showHide4(elementid4){ 
    if (document.getElementById(elementid4).style.display == 'none'){ 
    document.getElementById(elementid4).style.display = ''; 
    if(visibleDiv4 != ""){ 
     if(visibleDiv4 != elementid4){ 
     document.getElementById(visibleDiv4).style.display = 'none'; 
     } 
    } 
    visibleDiv4 = elementid4; 
    } else { 
    document.getElementById(elementid4).style.display = 'none'; 
    } 
} 

Answer 1

これは実際にコード化されていないため、コードを再利用して隠す要素を呼び出す必要があります。あなたは各要素のための関数を作成しました。

あなたはこのような主要機能を行っている必要があります。

function showHide(elementid, visibleDiv){ 
    if (document.getElementById(elementid).style.display == 'none'){ 
    document.getElementById(elementid).style.display = ''; 
    if(visibleDiv != ""){ 
     if(visibleDiv != elementid1){ 
     document.getElementById(visibleDiv).style.display = 'none'; 
     } 
    } 
    visibleDiv = elementid; 
    } else { 
    document.getElementById(elementid).style.display = 'none'; 

    } 
} 

以降単にような何かやって、その関数を呼び出します。

showHide('id-of-your-element', 'visible-div-etc'); 

を私は本当にこのシンプルとして、jQueryのカントーをつかん示唆しています箱をすぐにすぐにサポートすることができます。他のものに集中できます。 toggle()を使用するか、単に.hide()/.show()関数を使用してください。