jQuery函数在运行时不应该运行

Question

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

if if ($(window).width() < n) { }工作正常，因为背景颜色会发生变化（浅灰色适用于＆lt; 1000px，深灰色适用于＆gt; 1000px）。

由于该功能在运行时也不应该打破我的页面布局（单击选项卡然后调整大小以查看此内容）。当函数不能运行时，应该显示常规选项卡，它们会正确显示，直到您单击它们切换（这是被触发的功能，而不应该）。

任何可以帮助我的人？​​

Code

Demo（滚动＆lt;和＆gt; 1000px看）

PS：我知道虽然我仅限于使用此功能，但它会更好用。

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()的情况。