javascript - 在网页调整大小时更改样式表

Question

我已经让这个脚本几乎 100% 达到我想要的效果，但当窗口大小调整到超过 865 像素时，我无法让它停止闪烁。

我基本上构建了当窗口超过一定大小时将我的网站风格从移动设备更改为桌面设备。在大多数情况下，我使用本网站上提出的其他很棒的问题来构建它，但我就是无法结束它。

JavaScript:

$(window).on("resize", function() {        
    if ($(this).width() > 865) { 
        if (x != 'Desktop') { 
            var x = 'Desktop';
            $('head link[rel=stylesheet]').remove();
            $('head').append('<link rel="stylesheet" href="/IIS/_Stylesheets/HTMLPageReset.css" type="text/css" />');
            $('head').append('<link rel="stylesheet" href="/IIS/GRCAWebsite/_Stylesheets/GRCANew2015.css" type="text/css" />');
        }
    }
    if ($(this).width() < 865) { 
        if (x != 'Mobile') { 
            var x = 'Mobile';
            $('head link[rel=stylesheet]').remove();
            $('head').append('<link rel="stylesheet" href="/IIS/_Stylesheets/HTMLPageReset.css" type="text/css" />');
            $('head').append('<link rel="stylesheet" href="/IIS/GRCAWebsite/_Stylesheets/GRCANew2015_Mobile.css" type="text/css" />');
        }
    }
});

它在移动 View 中效果很好，但在桌面 View 中，每当调整窗口大小时，页面都会不断重新加载脚本。我认为这与我的 x 变量有关，但是

我也调用 JQuery。

Answer 1

既然你告诉浏览器在 865px 以下做一些事情，在 865px 以上做其他事情，你的问题很可能是你忘记了孤独的 865px 本身。尝试像这样调整其中之一

if ($(this).width() > 864)或if ($(this).width() < 866)

这样现在将捕获 865px。