javascript - jQuery 函数在不应该运行的时候运行

Question

我有一个函数，只需要在宽度小于特定值时运行。我已经用 if ($(window).width() < n) { } 完成了此操作但当宽度大于 n 时该函数也会运行..

如果 if ($(window).width() < n) { }由于背景颜色发生变化(浅灰色< 1000px，深灰色> 1000px)，效果很好。

因为该函数也在不应该分页布局的情况下运行(单击选项卡，然后调整大小以查看这一点)。当函数不应该运行时，应显示常规选项卡，如您所见，它们会正确显示，直到您单击它们切换(这是不应该触发的函数)。

谁能帮帮我？

Code

Demo (滚动 < 和 > 1000 像素即可查看)

PS:我知道尽管我仅限于使用 a 来实现这一点，但我知道 ' ' 会更好。

Answer 1

而不仅仅是 if (windowsize < 1000)您还需要了解当前状态。

if (is_large && windowsize < 1000)
{
    is_large = false;
    // rest of code to handle transition to small size
}
else if (!is_large)
{
    is_large = true;
    // code to handle transition to large size
}

您还需要处理设置 is_large 的情况在初始调用 checkWidth() 之前页面加载.