在javascript中刷新页面时阻止变量的更改值

Block change value of variable when refresh page in javascript

本文关键字：变量 javascript 刷新      更新时间：2023-09-26

我有两个变量的名字，第一个和最后一个。当窗口大小小于768px时，我希望first=1，last=5。当窗口大小大于768px时，first=1，last=3。这是我的密码。

var first = 1;
var last = 5;
window.onresize = function(){
    var w = window.innerWidth 
            || document.documentElement.clientWidth 
            || document.getElementsByTagName('body')[0].clientWidth;
    if (w <= 768){
        first = 1;
        last = 3;
    }
    if (w > 768){
        first = 1;
        last = 5;
    }
}

成功了。但是，当窗口大小为600px（小于768px）时，我按F5（刷新），第一个变量=1，最后一个变量=5（这些值会更改）。当我按下F5时，如果窗口小于768px，它仍然是1和3。我现在能做什么？帮帮我，谢谢。

应该是这样的。

现在，我们有一个函数，它根据窗口的宽度设置变量。我们称之为两次

  1. 当页面加载时，您应该根据窗口的大小设置变量（第一个、最后一个）

  2. 当页面被调整大小时，您应该再次设置变量。

    var first = 1;
var last = 5;
function setVariables()
{
var w = window.innerWidth 
        || document.documentElement.clientWidth 
        || document.getElementsByTagName('body')[0].clientWidth;
if (w <= 768){
    first = 1;
    last = 3;
}
if (w > 768){
    first = 1;
    last = 5;
}
}
window.onresize = function(){
setVariables();
} 
setVariables();

只需将函数移到一个单独的函数中，并在页面加载时重用它：

function checkWidth(){
    var w = window.innerWidth 
            || document.documentElement.clientWidth 
            || document.getElementsByTagName('body')[0].clientWidth;
    if (w <= 768){
        first = 1;
        last = 3;
    }
    if (w > 768){
        first = 1;
        last = 5;
    }
} 
...
var first = 1;
var last = 5;
window.onresize = checkWidth;
window.onload = checkWidth;
相关文章：