停止多次运行的嵌套javascript函数

停止多次运行的嵌套javascript函数,javascript,if-statement,onscroll,Javascript,If Statement,Onscroll,我试图让javascript函数只运行一次。例如,我见过以前有人问过这个问题,但我无法让这里的解决方案起作用。我不确定这是因为我有嵌套函数,还是我缺少了什么。本质上,我正在尝试运行一个函数,当一个网页被滚动时,它: -在标题的画布上运行一个小动画 -减小收割台的大小 -就这样吧 但当有任何后续滚动时,动画将继续重新运行。以下是非工作代码的摘要版本: $(document).on("scroll",function(){ var arrange_title = function(){

我试图让javascript函数只运行一次。例如,我见过以前有人问过这个问题,但我无法让这里的解决方案起作用。我不确定这是因为我有嵌套函数,还是我缺少了什么。本质上,我正在尝试运行一个函数,当一个网页被滚动时,它: -在标题的画布上运行一个小动画 -减小收割台的大小 -就这样吧

但当有任何后续滚动时,动画将继续重新运行。以下是非工作代码的摘要版本:

$(document).on("scroll",function(){

    var arrange_title = function(){

        //some code 
    };

    if($(document).scrollTop()>0){ 
        arrange_title();
        arrange_title = function(){};
        setTimeout(function(){
            $("header").removeClass("large").addClass("small");
        },1000);
    }
});

我还尝试声明一个全局变量,在“window.onload”函数中将其设置为“false”,然后在运行动画的if函数中将其设置为true(if函数仅在变量为false时运行),但这也不会阻止它。想法?

不要使用暂停。这就是你陷入麻烦的原因。使用var在函数外部声明一个变量,这将使它成为全局变量。您的代码应该在该变量的检查中。在第一次执行代码之前,但在检查内部,请更改该变量,使代码永远不会再次运行。

您要查找的是类似于listenToOnce的内容,侦听器只触发一次,但不会再次触发。这可以修改为许多调用,但逻辑如下:

注册侦听器。
然后,一旦侦听器启动,将其删除


尝试避免设置超时。几乎所有的动画都可以观看到结尾

function doHeaderAnimation() {
  return $('header').animate();
}

function makeHeaderSmall() {
  $("header").removeClass("large").addClass("small");
}

function handleScroll(event) {

  if ($(document).scrollTop() > 0) { 

    doHeaderAnimation().then(makeHeaderSmall);

    $(document).off("scroll", handleScroll);

  }

}

$(document).on("scroll", handleScroll);

对事件处理程序进行去抖动或节流有很多解决方案,而这正是您应该寻找的,即对滚动事件进行节流。海报上说,他们尝试了一个全局变量,但它不起作用,因此仅在没有任何代码显示如何使其起作用的情况下再次建议它是没有多大用处的。
function doHeaderAnimation() {
  return $('header').animate();
}

function makeHeaderSmall() {
  $("header").removeClass("large").addClass("small");
}

function handleScroll(event) {

  if ($(document).scrollTop() > 0) { 

    doHeaderAnimation().then(makeHeaderSmall);

    $(document).off("scroll", handleScroll);

  }

}

$(document).on("scroll", handleScroll);