Javascript onResize触发器螺钉动画

我在打电话给onResize的过程中遇到了下拉列表的问题。在新页面加载时，下拉导航功能正常工作，但如果调整浏览器大小并单击子导航的下拉菜单，则它移动速度很快，不会保持打开状态

这里有一个。

以下是JS：

var res;
onResize = function() {
var responsive_viewport = $(window).width();
var mobile_menu = $('nav div span');
var mobile_list = $('nav div #main-nav');

if (res){ clearTimeout(res)};
res = setTimeout(function(){
    console.log("resize triggered");

    if (responsive_viewport <= 1024) {

        mobile_menu.add(mobile_list).click(function(event) {
            mobile_list.slideToggle('fast', 'swing', function() {
                mobile_list.toggleClass('active');
            });
            event.stopPropagation();
        });

        $(document).click(function() {
            if (mobile_list.hasClass('active')) {
                mobile_list.slideToggle('fast', 'swing', function() {
                    mobile_list.removeClass('active');
                });
            }
        });
    }
    if (responsive_viewport <= 768) {
        console.log('on mobile');
        nextvid.addClass('mobile');
    } else {
        nextvid.removeClass('mobile');
    }

},200);
}
$(document).ready(onResize);
$(window).bind('resize', onResize);

var-res；
onResize=函数（）{
var\u viewport=$（window）.width（）；
var mobile_menu=$（'nav div span'）；
var mobile_list=$（'nav div#main nav'）；
if（res）{clearTimeout（res）}；
res=设置超时（函数（）{
console.log（“调整大小触发”）；
if（responsive_viewport发生的事情是每次调整窗口大小（我猜是计算页面加载）您绑定到单击项目的事件。因此，当您调整窗口大小一次时，事件触发两次，下拉菜单打开然后关闭。如果您再次调整窗口大小，下拉菜单现在打开、关闭，然后再次打开。长话短说，您应该只绑定一次！如果您想更改绑定（如切换到移动视图）然后，您应该以不同的方式重新绑定

祝你好运！
谢谢@matty-d。我尝试了一些技术，包括最简单的，在
$（窗口）
上的bing之前添加
unbind（）
。你能给我一个基于jsfiddle的例子吗？