标签: setinterval

我开始使用一个实际上可以顺利运行的JavaScript MMORPG.目前,我创建了一个演示来证明我可以移动角色并让他们互相聊天,以及看到彼此在现场移动.

http://set.rentfox.net/

现在Javascript计时器是我没有广泛使用的东西,但据我所知,如果我错了就纠正我,是否同时发生多个setIntervals并不能很好地运行b/c它只是在一个线程上.

让我们说我希望有10个不同的人通过使用带有setInterval的精灵背景定位来对怪物进行火球训练 - 该动画需要10个setIntervals来重新绘制用于精灵背景位置移位的DOM.那不是一辆大马车吗？

我想知道是否有办法绕过这一切,也许使用Canvas,这样动画可以同时发生而不创建事件队列,我不必担心计时器.

希望有意义,如果我需要进一步澄清,请告诉我.

我正在使用jQuery构建的ui选项卡.一切都有效,除了一个问题 - 我做了一个setInterval运行一个触发器("click")的函数,以便它在5000毫秒后进入下一个标签.它可以很好地运行每个选项卡,问题是如果用户手动单击选项卡,则setInterval的计时器不会在0处重新启动.例如,如果用户在0毫秒时在tab1上启动并在tab2处单击2000毫秒,setInterval不会回到0,它将从2000开始并运行到5000毫秒,然后转到tab3.我理解为什么会这样,我只是想知道是否有办法重新启动setInterval时序而不必执行clearInterval()并创建一个全新的setInterval().任何见解将不胜感激.

更新

感谢回复 - 我试图避免使用clearInterval的原因是因为我遇到了如何以clearInterval完全停止setInterval的方式编写代码的问题.代码设置为在用户单击选项卡时进行跟踪.问题是自动更改功能使用触发器('click'),因此当选项卡自动更改时,它也运行我写的clearInterval函数.它本身运行起来相当不错,但是一旦用户开始单击选项卡,setInterval就会表现异常并且无法预测地切换选项卡.我怀疑发生的事情是几个setIntervals同时运行...这是代码(如果你还没有猜到它,我在javascript/jquery上很新).我已经注释掉它的功能,但它仍然没有

// auto change tabs
            if( options.interval ) {

                function timerCom() {
                    if( !$(".controller").hasClass('paused') ) {
                        var i = $(".tab-current > a").attr("rel");
                        //alert(i);
                        if( i == 3 ) {i = 0};
                        $container
                            .find('a')
                            .eq(i)
                            .trigger('click');
                    }    
                }

                //$("#promo-items > li > a").click(function () {
                    //var timer;
                    //if( timer != null ) {clearInterval(timer);}
                    timer = setInterval(timerCom, options.interval);

                //});

            }

我在网站中使用setInterval函数,它在IE,Chrome,Firefox和Safari中运行良好.当我在ipad/iphone(safari mobile)上尝试时,我遇到问题:如果我滚动屏幕,setInterval函数暂停,只有当我停止滚动时它才会恢复!

有没有办法防止该功能暂停？谢谢

如何从其事件函数内部访问setTimeout/setInterval调用的进程id,因为Java线程可能访问自己的线程ID？

var id = setTimeout(function(){
    console.log(id); //Here
}, 1000);
console.log(id);

我正在为datetime对象使用自定义的angular.js过滤器:

function relativeTimeFilter()
{
    return function (dateObj) {
        return getRelativeDateTimeString(dateObj);
    };
}

function getRelativeDateTimeString(dt)
{
    if(!dt) return "undefined ago";

    var delta = dt.getSeconds();
    if (delta < 0) return "not yet";
    if (delta < 1 * 60) return delta == 1 ? "one second ago" : delta + " seconds ago";
    if (delta < 2 * 60) return "a minute ago";
    if (delta < 45 * 60) return Math.floor(delta/60) + " minutes ago";
    if (delta < 90 * 60) return "an …

我环顾四周试图理解如何SetInterval但只找到了如何使用它.我已经知道它的功能,我只是好奇当JS不支持线程时它是如何能够在单独的线程上运行的(至少这是我读过的).

我希望我能正确地提出这个问题.

谢谢.

我正在尝试仅使用 javascript 控制台创建一个自动化程序。我需要使用 setInterval 为我的程序创建一个循环。相关部分的代码如下：

freshIntervalId=setInterval(tick,500);

因此“tick”函数每 500 毫秒就会被调用一次。

但问题是，每当浏览器选项卡处于非活动状态时，即我将其最小化以执行其他操作时，setInterval 就会停止工作。当我再次打开浏览器时，它突然重复了很多次，以“补偿”函数未执行的时间。这不是我所期望的。

我听说网络工作者可以解决这个问题。我只需要一（或两）行代码即可通过网络工作者进行工作，但由于我是 IT 业余爱好者，所以我无法理解所有代码行。我只能通过 JS 控制台访问浏览器，并且无法访问 HTML 及其脚本。

我的主要目标是使其循环并正常中断（setInterval 和clearInterval），同时浏览器仍处于非活动模式。

我现在应该怎么做？感谢您的阅读，希望有人能帮我解决这个问题！

我正在尝试使用setInterval卸载组件.

这是基于这里的答案:

零件:

class ImageSlider extends React.Component {
  constructor(props) {
    super(props);
    this.state = { activeMediaIndex: 0 };
  }

  componentDidMount() {
    setInterval(this.changeActiveMedia.bind(this), 5000);
  }

  changeActiveMedia() {
    const mediaListLength = this.props.mediaList.length;
    let nextMediaIndex = this.state.activeMediaIndex + 1;

    if(nextMediaIndex >= mediaListLength) {
      nextMediaIndex = 0;
    }

    this.setState({ activeMediaIndex:nextMediaIndex });
  }

  renderSlideshow(){
    const singlePhoto = this.props.mediaList[this.state.activeMediaIndex];
      return(
        <div>
          <img src={singlePhoto.url} />
        </div>
      );
    }

  render(){   
    return(
      <div>
          {this.renderSlideshow()}
      </div>
    )
  }
}

现在,当我转到另一个页面时,我收到此错误:

Can only update a mounted or mounting component. This …

介绍 我在 create-react-app 应用程序中有一个用户输入元素。它允许用户输入数字，或使用箭头向上或向下增加数字。然后输出显示这个数字。

问题 用户想要到达某个数字，无论他们如何输入数字，都会有虚假的中间值触发 onChange 事件侦听器。如果用户尝试使用键盘输入“15”，则输出首先是“1”，然后是“15”，但我希望它只是“15”。我不想使用按钮/提交/等或其他事件。如果用户按下并按住从 0 到 500 的向上箭头，我想在“快速变化”输入减慢/停止后直接更新到 500。

目标 我想编写一个 onChange 函数，以便仅在 onChange自上次事件以来至少 600 毫秒未触发事件时才更新输出。

详细信息 如果用户键入 '1' 和 '5'（表示 '15' ）的间隔小于 600 毫秒，则输出应更新为 '15'，并跳过 '1'。但是，如果用户在键入“1”和“5”之间的时间超过 600 毫秒，则输出应首先是“1”，然后是“5”。同样，如果用户非常快速地上下按下增量箭头，则输出不应更新，直到它们停止或减慢。

在终端中，使用 create-react-app 制作一个反应应用程序

create-react-app delay-output-app

将代码 复制并粘贴到 delay-output-app/src/App.js 中，替换之前的所有代码。

import React, { useState, useEffect, useRef } from "react";
import "./App.css";

function App() {
  const inputRef = useRef();
  const [userValue, setUserValue] = useState(0);
  const [output, setOutput] = useState(0);

  const updateOutput = () => {
    setUserValue(inputRef.current.value);
    setOutput(inputRef.current.value); …

我最近使用 React 的钩子从服务器获取数据，但我遇到了钩子的问题。代码看起来是正确的，但看起来 useEffect 不是第一次调用，而是在 setInterval 3 秒后调用。在它出现之前，我有 3 秒钟的空白表格。我想直接显示数据，3秒后调用。

正确的使用方法是什么？

const [datas, setDatas] = useState([] as any);

  useEffect(() => {
    const id = setInterval(() => {
        const fetchData = async () => {
          try {
            const res = await fetch(URL);
            const json = await res.json();
            setDatas(jsonData(json));
          } catch (error) {
            console.log(error);
          }
        };
        fetchData();
    }, TIME)

    return () => clearInterval(id);
  }, [])