让jQuery代码在窗口中加载，滚动和调整大小只触发一次

Make jQuery code in window load, scroll and resize only fire once?

本文关键字：一次 调整 窗口 代码 jQuery 加载 滚动      更新时间：2023-09-26

我有在窗口加载、滚动和调整大小时触发的代码：

jQuery(window).bind("load scroll resize", function() {
   // do stuff on every event
   // do something else only once
});

然而，我希望代码的一部分只启动一次。如何做到这一点？

UPDATE-我已经在重新启动的代码中定义了一个变量，理想情况下我喜欢在重新启动代码中使用它。

这似乎是您真正想要的：

jQuery(document).ready(function () {
    var foo = "bar"; //define on load
    jQuery(window).on("scroll resize", function () {
        jQuery("body").append(foo); // used on scroll/resize events
    })
})

Fiddle（您可以调整Fiddle窗口的大小，以使用定义的变量查看事件的工作情况）

如果你也希望滚动/调整大小事件发生在初始加载时，你可以这样做：

jQuery(document).ready(function () {
    var foo = "bar"; //define on load
    var myFunc = function () {
        jQuery("body").append(foo); // used on scroll/resize events
    }
    myFunc();
    jQuery(window).on("scroll resize", myFunc)
})

Fiddle

您可以使用测试滚动的另一个示例-癫痫警告：）

另外，我在示例中使用了jQuery()，正是因为您这样做了。除非你有某种冲突，否则大多数人更喜欢使用快捷方式$()。

如果与我的示例代码有任何混淆，您的上述代码（注释）将如下所示：

jQuery(document).ready(function () {
    // do something else only once
    var myFunc = function () {
        // do stuff on every event
    }
    myFunc(); //remove this if you don't want it called on initial load
    jQuery(window).on("scroll resize", myFunc)
})

基本上在上面的示例中，在初始加载时，您的函数和事件将被声明、初始化和调用。然后，每次滚动和调整大小事件发生时，都会调用该函数。

var some_var = 1;
$(window).on("load scroll resize", function() {
   // do stuff on every event
});
$(window).one("load scroll resize", function() {
   // do stuff only once
});

这将只执行一次代码的一部分，而每次执行另一部分。由于some_var是在这两个块之外声明的，因此它在这两个中都可用。

相关文章：