Доступ к дочерним узлам, чтобы скрыть / показать выпадающий список - PullRequest
0 голосов
/ 09 февраля 2019

Я пытаюсь иметь несколько выпадающих списков на моей навигационной панели.Я хочу, чтобы функция, которая их вводила и выводила, была общей, а не создавала функцию для каждого раскрывающегося списка.

Я пытался сделать следующее, чтобы вставить их:

<script>
document.addEventListener("click", function(e){
    var elem = e.target;
    if(document.getElementById(elem.id).className == ".dropdown-trigger .dropdown-toggle")
    {
        var parent = document.getElementById(elem.id).parentNode;
        var children = document.getElementById(parent.id).children;
        if(e.target == children[0])
        children[1].style.display="block";
    }
});
</script>

Принимая во внимание, что children [0] относится к раскрывающемуся ярлыку, а children [1] относится к самому раскрывающемуся раскрывающемуся списку.

Вот интерфейс html:

          <li class="dropdown-container dropdown-right rightside dropdown-down" data-skip-responsive="true">
                    <a href="#" class="dropdown-trigger dropdown-toggle">Server</a>
                    <div class="dropdown hidden" style="display: none; margin-right: -3151.05px;">
                        <div class="pointer"><div class="pointer-inner"></div></div>
                        <ul class="dropdown-contents dropdown-nonscroll" style="margin-left: 0px; left: 0px; max-width: 1899px;">
                            <li class="font-icon"><a target="_blank" href="#test"><i class="fa fa-wrench"></i> Control Panel</a></li>
                            <li class="font-icon"><a target="_blank" href="#test"><i class="fa fa-wechat"></i> Chat</a></li>
                            <li class="separator"></li>
                            <li class="font-icon"><a target="_blank" href="#test"><i class="fa fa-user"></i> Administrators</a></li>
                            <li class="font-icon"><a target="_blank" href="#test"><i class="fa fa-support"></i> Helpers</a></li>
                        </ul>
                    </div>
                </li>

, но это не такработает .. Кто-нибудь может увидеть, где проблема?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...