Javascript setInterval每次运行时间越短

所以我已经制作了一个按字母打印出文字的函数，如下所示（我知道我的命名方案不好，请不要开玩笑。我还是相当新的编码，所以我的代码看起来有点奇怪/低效的。）Javascript setInterval每次运行时间越短

var text = document.getElementById("gametext") 
var dialog = "the entire text you want to print out" 
var talk = "The whole text gets added here, letter by letter" 
var charinc = 0 

function talky() { 
    setInterval(function(){ 
    if(charinc < dialog.length){ 
    talk = dialog.charAt(charinc++); 
    text.innerHTML += talk; 
    } 
    }, 100); 
    charinc = 0 
}

，我调用这个函数多次在我的代码，设置对话框，不管它是什么，我想打印，和然后调用该函数。一开始它运行良好，但每次运行它时，看起来字母的打印速度越来越快。我不确定发生了什么，或者如何解决它。我在谷歌上做过几次搜索，但没有任何用处。

来源

2016-05-08 twondai

你为什么初始化'talk'当你刚刚要去从'charAt'分配结果呢？ –

每次调用'talky（）'时，都会调用'setInterval（）'并注册一个函数，每100毫秒调用一次。你永远不会使用'setInterval'来存储句柄......并且从不在其上使用'clearInterval（）'...因此，最终会有多个间隔函数运行，这会给间距周期减少_appearance_。 – canon

第一次运行它时，每隔100ms就有一个间隔运行。

第二次运行它时，您有两个间隔，每个间隔每100毫秒运行一次。

依此类推。

由于它们共享相同的变量，因此您只需使每个变量以每100ms一次写入的速度增加输出速度。

或者：

电话clearInterval(...)当你完成
传递全局变量作为参数传递给talky所以他们没有多间隔之间共享
只需更新变量而不是再次呼叫talky

来源

2016-05-08 19:59:20 Quentin

好吧，我现在明白了这个问题，但我不太清楚我应该如何使用clearInterval。我应该每当我想运行talky时手动调用它？我应该把它插入通话内的某个地方吗？对不起，如果我听起来像一个白痴，但我仍然是一个新的编码（似乎我很容易理解一些概念，而其他人，如间隔，就在我头上） – twondai

“当你完成” ，即作为'else'来表示if（charinc Quentin

setInterval会让你定义的函数每隔100ms运行一次。如果你像你说的那样多次调用这个函数，将会有几个间隔并行运行，这可能不是你想要的。

您可以使用clearInterval和setInterval返回的ID来清除现有时间间隔。

例如

var intervalId = setInterval(function() { console.log('hello, world!') }, 100); clearInterval(intervalId);

来源

2016-05-08 20:00:53

Javascript setInterval每次运行时间越短

回答

相关问题