javascript並非總是以正確的順序觸發，有時會中斷

Question

由於種種原因，我對此有些困惑，有時可以，有時不能。 當您將視口縮小到小於945px時，subnav元素應切換，但有時不切換。 我也得到了一些意想不到的結果。

我在這里有一個Codepen

https://codepen.io/robbiemcmullen/pen/BqdRpN

我的代碼如下：

 //toggle for subnavs
        $(document).ready(function(){

            //only toggle if window size is less than 945px
            $(window).resize(function(){

                var submenu = $('.nav-wrapper');

                if (window.innerWidth < 945) {
                    $(document).on('click','nav ul li',function() {

                        $(submenu).toggle();

                    });
                }
            });

            var listItem = $('.navigation-toggles__list-item');

             //hide mega menu when settings activated
             $(listItem).mouseleave(function(){
                      $(userMenu).hide();
             });

             var userIcon = $('.navigation-user-icon'),
             userMenu = $('.dashboard-user-menu');

            //toggle dashboard menu
             $(userIcon).click(function(e) {
             e.preventDefault();
                    $(userMenu).toggle();
            });


        });

誰能告訴我我要去哪里錯了？