Javascript setTimeout 不会在 clearInterval() 上停止

coder 2025-02-19 原文

当 clearInterval() 没有停止时，如何停止计时器？

此代码的目的是使数字从 0 开始动画化，直到到达末尾(例如从 0...75% 开始动画化)。但是当我调用 clearInterval() 时计时器不会停止:

<div id="foo"></div>
<div id="bar"></div>

animate("99%", $("#foo")); // doesnt stop
animate("75%", $("#bar")); // doesnt stop

function loop(clr, clr2, ele, rand, last, delay) {
    clearInterval(clr);
    clearInterval(clr2);
    inloop(clr, clr2, ele, rand, last, delay);

    if (rand >= last) {
        clearInterval(clr);
        clearInterval(clr2);
    }
    else {
        clr2 = setTimeout(function () {
            loop(clr, clr2, ele, rand, last, delay);
        }, 2500);
    }

}
function inloop(clr, clr2, ele, rand, last, delay) {
    ele.html((rand += 1) + "%");

    if (rand >= last) {
        clearInterval(clr);
        clearInterval(clr2);
    }
    else {
        clr = setTimeout(function () {
            inloop(clr, clr2, ele, rand, last, delay);
        }, delay);
    }
}

function animate(end, display) {
    var clr = null;
    var clr2 = null;
    var ele = null;
    var rand = 0;  // initial number
    var last = 99; // last number
    var delay = 5; // inner loop delay

    ele = display;
    ele.html("0%");

    var idx = end.indexOf("%");
    if (idx >=0) {
        end = end.substring(0,idx);
    }
    last = parseInt(end);
    loop(clr, clr2, ele, rand, last, delay);
}

最佳答案

您使用 clearTimeout()使用 setTimeout()。

您不要将 clearInterval() 与 setTimeout() 一起使用。 clearInterval() 与 setInterval() 一起使用。

您的代码中也存在结构性问题。您将 clr 和 clr2 作为参数传递，并期望修改它们的原始值，但它们没有。

你可以通过将它们都放在一个对象中并像这样传递对象来解决这个问题:

animate("99%", $("#foo"));
//animate("75%", $("#bar"));

function loop(timers, ele, rand, last, delay) {
    clearTimeout(timers.clr);
    clearTimeout(timers.clr2);
    inloop(timers, ele, rand, last, delay);

    if (rand >= last) {
        clearTimeout(timers.clr);
        clearTimeout(timers.clr2);
    }
    else {
        timers.clr2 = setTimeout(function () {
            loop(timers, ele, rand, last, delay);
        }, 2500);
    }

}
function inloop(timers, ele, rand, last, delay) {
    ele.html((rand += 1) + "%");

    if (rand >= last) {
        clearTimeout(timers.clr);
        clearTimeout(timers.clr2);
    }
    else {
        timers.clr = setTimeout(function () {
            inloop(timers, ele, rand, last, delay);
        }, delay);
    }
}

function animate(end, display) {
    var timers = {clr: null, clr2: null};
    var ele = null;
    var rand = 0;  // initial number
    var last = 99; // last number
    var delay = 5; // inner loop delay

    ele = display;
    ele.html("0%");

    var idx = end.indexOf("%");
    if (idx >=0) {
        end = end.substring(0,idx);
    }
    last = parseInt(end);
    loop(timers, ele, rand, last, delay);
}

工作 jsFiddle:http://jsfiddle.net/jfriend00/PEqeY/

关于Javascript setTimeout 不会在 clearInterval() 上停止，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10628504/

有关Javascript setTimeout 不会在 clearInterval() 上停止的更多相关文章

ruby - Highline 询问方法不会使用同一行 - 2
设置:狂欢ruby1.9.2高线(1.6.13)描述:我已经相当习惯在其他一些项目中使用highline，但已经有几个月没有使用它了。现在，在Ruby1.9.2上全新安装时，它似乎不允许在同一行回答提示。所以以前我会看到类似的东西:require"highline/import"ask"Whatisyourfavoritecolor?"并得到:Whatisyourfavoritecolor?|现在我看到类似的东西:Whatisyourfavoritecolor?|竖线(|)符号是我的终端光标。知道为什么会发生这种变化吗？最佳答案
ruby-on-rails - 项目升级后 Pow 不会更改 ruby 版本 - 2
我在我的Rails项目中使用Pow和powifygem。现在我尝试升级我的ruby版本(从1.9.3到2.0.0，我使用RVM)当我切换ruby版本、安装所有gem依赖项时，我通过运行railss并访问localhost:3000确保该应用程序正常运行以前，我通过使用pow访问http://my_app.dev来浏览我的应用程序。升级后，由于错误Bundler::RubyVersionMismatch:YourRubyversionis1.9.3,butyourGemfilespecified2.0.0，此url不起作用我尝试过的:重新创建pow应用程序重启pow服务器更新战俘
ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2
我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的
ruby-on-rails - prawnto 显示新页面时不会中断的表格 - 2
我有可变数量的表格和可变数量的行，我想让它们一个接一个地显示，但如果表格不适合当前页面，请将其放在下一页，然后继续。我已将表格放入事务中，以便我可以回滚然后打印它(如果高度适合当前页面)，但我如何获得表格高度？我现在有这段代码pdf.transactiondopdf.table@data,:font_size=>12,:border_style=>:grid,:horizontal_padding=>10,:vertical_padding=>3,:border_width=>2,:position=>:left,:row_colors=>["FFFFFF","DDDDDD"]pdf.
ruby - 使用 Ruby Daemons gem 检测停止 - 2
我正在使用rubydaemongem。想知道如何向停止操作添加一些额外的步骤？希望我能检测到停止被调用，并向其添加一些额外的代码。任何人都知道我如何才能做到这一点？最佳答案查看守护程序gem代码，它似乎没有用于此目的的明显扩展点。但是，我想知道(在守护进程中)您是否可以捕获守护进程在发生“停止”时发送的KILL/TERM信号...？trap("TERM")do#executeyourextracodehereend或者你可以安装一个at_exit钩子(Hook):-at_exitdo#executeyourextracodehe
ruby - 如何停止 jekyll 本地服务器 - 2
我刚刚在本地设置了我的第一个Jekyll项目。我已经让服务器运行，但我忘了使用自动标志。所以现在我想停止服务器并使用标志重新启动。但是，在我启动服务器后的命令行中，我没有得到新的提示，所以我无法输入任何新命令。我不太习惯命令行，所以我真的很感激知道我应该做什么!我正在使用MacOSX和terminal.app，如果有区别的话! 最佳答案 psaux|grepjekyll|awk'{print$2}'|xargskill-9 关于ruby-如何停止jekyll本地服务器，我们在StackO
ruby-on-rails - 使用 ApplicationController.renderer.render 从 Controller 外部渲染的 Rails 5 不会在自身上设置变量 - 2
我正在使用Rails5ApplicationController.renderer.render方法从模型中进行渲染。我需要将一些变量传递给我的布局，这是我使用locals选项完成的；如果直接访问此变量，则该变量在布局中可用，但不能通过self访问。这是我设置渲染的方式html_string=ApplicationController.renderer.render(file:"/#{template_path}/base/show",:formats=>[:pdf,:html],locals:{:@routing_form=>self,:controller_name=>contro
ruby-on-rails - EC2 实例在负载均衡器中停止服务 - 2
我有一个EC2实例正在运行。我有一个负载均衡器，它与EC2实例相关联。PingTarget:HTTP:3001/healthCheckTimeout:5secondsInterval:24secondsUnhealthythreshold:2Healthythreshold:10现在该实例显示为OutofService。我什至尝试更改监听端口等等。一切正常，直到重新启动我的EC2实例。任何帮助将不胜感激。仅供引用:我有一个在端口3001上运行的Rails应用程序，我有一个用于HTTP:80(loadbalancer)到HTTP:3001的监听器。我还在终端中通过ssh检查了正在运行的应
c - ruby的rb_raise如何停止调用它的c函数的执行？ - 2
如果你在C中将一个ruby方法写成一个使用rb_raise的函数，调用后的函数部分将不会被执行，程序将停止，你会认为rb_raise使用了exit()。但是如果你在ruby中拯救异常，比如:beginmethod_that_raises_an_exceptionrescueendputs'Youwilstillgethere.'ruby代码将继续，但您的函数将停止执行。rb_raise如何实现这一目标？最佳答案推测它使用了setjmp(在调用方法之前)和longjmp(在rb_raise中)。
ruby - 停止分布式 Ruby 服务 - 2
我有一个启动DRb服务的脚本，然后生成处理程序对象并通过DRb.thread.join等待。我希望脚本一直运行直到被明确杀死，所以我添加了trap"INT"doDRb.stop_serviceend在Ruby1.8下成功停止DRb服务并退出，但在1.9下似乎死锁(在OSX10.6.7上)。对该进程进行采样显示在semaphore_wait_signal_trap中有几个线程在旋转。我假设我在调用stop_service时做错了什么，但我不确定是什么。谁能给我任何关于如何正确处理它的指示？最佳答案好的，我想我已经找到了解决方案。如

Javascript setTimeout 不会在 clearInterval() 上停止

有关Javascript setTimeout 不会在 clearInterval() 上停止的更多相关文章

随机推荐