раскрывающееся меню с функцией «щелчка» требует двойного щелчка на сенсорном экране

Question

У меня есть меню с раскрывающимися списками, которые активируются при нажатии. Это работает до тех пор, пока я не использую сенсорный экран, который затем нужно дважды щелкнуть, прежде чем меню откроется. Вот код Javascript, который я использовал для этой настройки.

      var MenuItem_WithChild = document.querySelectorAll("#menu .menu-item-has-children");
for(i=0; i< MenuItem_WithChild.length; i++){
    MenuItem_WithChild[i].addEventListener("click", subMenuOpen);
    
    function subMenuOpen() {
        for (i = 0; i < MenuItem_WithChild.length; i++) {
            MenuItem_WithChild[i].classList.remove("active");
        }

        this.classList.add("active");
    }
}

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

Любая помощь будет принята с благодарностью. Спасибо.

Answer 1

Добавьте событие «touchend» для сенсорных экранов или удалите эффект наведения из CSS. (Вы можете создать функцию onclick и вызывать ее в событии щелчка и событии касания)