Jquery 火灾调整事件一次缩小尺寸，一次增大尺寸

因此，我有一个功能，我想在浏览器调整到某一点时启动一次

largeWindow = window.matchMedia( 'screen and (min-width: 650px)' );
jQuery( window ).on('resize', function() {
    if ( ! largeWindow.matches ) {
        jPM.on();
        jQuery(window).off('resize');
    }
});

这很好，函数只运行一次，一旦我们调整到650px以上

我遇到的问题是重新调整大小

我想在我们调整到650px之后启动另一个函数

唯一不同的是jPM.off（）而不是on

其要点是在浏览器小于650px时打开jPanelMenu，在浏览器大于650px时重新打开。我想另一个问题是我需要这种事情反复发生

使用jQuery（window）.bind（'resize…）会在浏览器调整大小时反复启动函数。因此jPM.on（）会运行50次，并不断初始化插件，这会造成一片混乱

有人给我一些建议吗

---

谢谢！

你最好的选择是使用计时器。我经常通过调整窗口大小来实现这一点。我发现1/4秒是一个很好的时间

jQuery(function() {
    var windowResize;
    jQuery(window).resize(function(e) {
        clearTimeout(windowResize);
        windowResize = setTimeout(function() {
            /*
                DO WORK
            */
        }, 250);
    });
})

---

一个简单的解决方案是使用一个“标志”。在本例中，我使用一个类来定义html元素

$（窗口）.on（'resize'，function（））{
if（（！$（'html'）.hasClass（'small'））&（$（window.width（）<650））{
$（'输出'）.text（'小'）；
$（'html'）.addClass（'small'）.removeClass（'large'）；
}
else if（！$（'html'）.hasClass（'large'））和（$（window.width（）>650））{
$（'输出'）.text（'大'）；
$（'html'）.addClass（'large'）.removeClass（'small'）；
}
});

当然，您可以创建一个变量来存储页面的状态（大与小）。 这个例子可能更“直观”更容易理解

$(window).on('resize', function() {
    if ((!$('html').hasClass('small')) && ($(window).width() < 650)) {
        $('#output').text('small');
        $('html').addClass('small').removeClass('large');
    }
    else if ((!$('html').hasClass('large')) && ($(window).width() > 650)) {
        $('#output').text('large');
        $('html').addClass('large').removeClass('small');
    }
});