1

[ドライバーのダウンロード] をクリックすると、他のリストが開いたままになり、[ドライバーのダウンロード] をもう一度クリックすると、再び閉じられるはずです。クリックするだけではホバーしません。また、ドライバーのダウンロードの下にあるいくつかのliをクリックしたときに閉じたくありません

ここに私のHMTLがあります：

<ul class="dropdown">
    <li><a id="drivers" onclick="dropdown(this); return false;" class="dir">Download Drivers</a>
        <ul id="driversmenu" class="sub">
            <li><a>Download Drivers</a></li>
            <li><a>Driver Widget</a></li>
            <li><a>NVIDIA Software</a></li>
        </ul>
    </li>
    </ul>

Javascript コードは次のとおりです。

   function dropdown(obj)
   {
       alert("klik");
       var elements = document.getElementsByClassName("sub");
       var ids = '';
       for (var i = 0; i < elements.length; i++)
       {
           document.getElementById(elements[i].id).style.display = 'none';
       }

       if (document.getElementById(obj.id + 'menu').style.display == 'block')
       {
           alert("al open");
           document.getElementById(obj.id + 'menu').style.display = 'hidden';
       }
       else if (document.getElementById(obj.id + 'menu').style.display = 'hidden')
       {
           alert("niet open");

           document.getElementById(obj.id + 'menu').style.display = 'block';
       }
       return false;
   };

そしてcssですが、それが関連しているかどうかはわかりません：

ul.dropdown {    list-style-type: none; width: 300px;float: left; height: 0px; margin-top: 0px; padding-left: 0px; }
ul.dropdown a { display: block; color: white; text-decoration: none;     list-style-type: none; }
ul.dropdown li {  float: left; padding: 0 0px; border: 1px dotted #d0d0d0;     list-style-type: none;}
ul.dropdown li ul { display: none; position: absolute; z-index: 99; }
ul.dropdown li ul li { clear: both; margin-left: 0px; padding-left: 0px; border: 0; min-width: 150px;  }
ul.dropdown li ul li:hover { background-color: #d1d1d1; }
ul.dropdown li ul li:hover a { color: red; }

「Klik」と「Niet open」からのみアラートを受け取るため、これは決して呼び出しません。

if (document.getElementById(obj.id + 'menu').style.display == 'block')
{
    alert("al open");
    document.getElementById(obj.id + 'menu').style.display = 'hidden';
}

誰かが私が間違っていることを知っていますか? 前もって感謝します

4

1 に答える 1

2

試す

function dropdown(obj)
{
    var elements = document.getElementsByClassName("sub");
    var ids = '', display = document.getElementById(obj.id+'menu').style.display;
    for(var i=0; i < elements.length; i++) {
        elements[i].style.display='none';
    }
    if(!display || display=='none'){
        document.getElementById(obj.id+'menu').style.display='block';
    }
    return false;
};

デモ:フィドル

于 2013-04-26T12:58:46.283 に答える