주소 표시 줄이 페이지에 표시되면 모바일에서 JavaScript 코드가 작동하지 않습니까?

Question

주소 표시 줄이 페이지에 표시 될 때 모바일 (Android 크롬)에서 작동하지 않는 자바 스크립트 코드 (요소의 클래스 토글)가 있습니다.

코드는 메뉴 전환, 옆에있는 "제품"메뉴에 + 버튼입니다 :

는 다음과 같이 작동하지 않도록

확인 권리 : 가능한 한 빨리

그러나 나는 조금 아래로 스크롤하고 모바일 주소 표시 줄을 숨 깁니다. IT WORKS! :

무슨 일입니까? 난 너무 혼란 스러워요. 검색 주소창을 표시하면이 코드의 작동 방식이 변경되는 이유는 무엇입니까?

이

코드입니다 :

또한

m.find('.menu-dropdown-toggle').click(function(e){ 
      e.preventDefault(); 
      var $li = $(this).parents('li').first(); 
      if ($li.hasClass('toggle-closed') || ! ($li.hasClass('toggle-open') || $li.hasClass('current-menu-item') || $li.hasClass('current_page_ancestor') || $li.hasClass('current_page_item') || $li.hasClass('current_page_parent'))) { 
       $li.removeClass('toggle-closed').addClass('toggle-open'); 
      } else { 
       $li.removeClass('toggle-open').addClass('toggle-closed'); 
      } 

      return false; 
     }); 

이 다른 모바일 웹 사이트에 잘 작동, 그것은 모바일에서 잘 작동 http://beautiful.dtbaker.net/ 예 (주소 바 - 볼 - 버그를 가지고있다 특정 단지이 하나).

Answer 1

이벤트가 두 번 트리거됩니다. 첫 번째 트리거는 메뉴를 열고 두 번째 트리거는 메뉴를 닫습니다. 이것은 주소 표시 줄이 표시 될 때 왜 일어나는지 설명하지 않지만 일부 디버깅이 나타내는 것입니다.

다른 스크립트가 프로그래밍 방식으로 수행 중일 수 있지만 그다지 디버그하지 않았습니다.

debounce를 사용하면 실제로 이유를 해결하지 않고도 문제를 해결할 수있는 특정 시간 내에 한 번만 트리거되도록 할 수 있습니다.

Answer 2

봅니다 ... 블록

if ($li.hasClass('toggle-closed') || ! ($li.hasClass('toggle-open')) { ....} 

그것이 작동하는지에 원치 않는 상태를 제거하는