javascript - 当窗口通过某些多个宽度时重新加载页面

Question

仅当浏览器窗口通过宽度 300 像素或 769 像素或 1024 像素时，我才需要重新加载页面

我的请求有一个类似的问题（http://goo.gl/46jjzH），但批准答案的唯一问题是页面在仅通过 769px 后重新加载，我需要对 3 种不同尺寸 300px 或 769px 执行相同操作或 1024 像素，而不仅仅是 769 像素。

这两个代码仅适用于http://goo.gl/46jjzH中的一个特定宽度

@Roko C. Buljan 的第一个代码

var ww = $(window).width();
var limit = 769;

function refresh() {
   ww = $(window).width();
   var w =  ww<limit ? (location.reload(true)) :  ( ww>limit ? (location.reload(true)) : ww=limit );
}

var tOut;
$(window).resize(function() {
    var resW = $(window).width();
    clearTimeout(tOut);
    if ( (ww>limit && resW<limit) || (ww<limit && resW>limit) ) {        
        tOut = setTimeout(refresh, 100);
    }
});

@gdoron 的第二个代码

var width = $(window).width();
$(window).resize(function() {
    if (width > 769 && $(window).width() < 769) {
        location.reload();
    }
    else if (width < 769 && $(window).width() > 769) {
        location.reload();
    }
});​

Answer 1

使用第二个代码示例，您可以使用运算符检查替代条件or。

var prevWidth = $(window).width();
$(window).resize(function() {
    var currentWidth = $(window).width();

    if (
        (prevWidth > 769 && currentWidth  < 769) 
        || (prevWidth > 300 currentWidth  < 300)
        || (prevWidth > 1024 currentWidth  < 1024)  
    )

    {
        location.reload();
    }

});​