具有一个函数的多个设置间隔（Javascript）

此代码随机播放音频元素。运行两次

setup

可以同时对两个不同的阵列执行此操作，这正是我想要的。问题是

#stop

只会停止其中一个阵列的播放。如果只在一个数组上调用

setup

，但多次单击

#start

（我也不希望这样），也会发生这种情况。我认为这与“intervalReturn”有关，因为它只会被指定为一个

setInterval

我应该如何编写此代码，以便多次调用

setup

创建只可启动一次的不同设置间隔

或者，如果我从一个完全不同的角度来看待这个问题，有什么更好的办法

编辑：这是根据下面的建议修复的。但我想知道，setInterval在“引擎盖下”是怎么回事？为什么会发生这种行为？（特别是：

#stop

停止一个但不是所有音频元素。）

但我想知道，setInterval的“引擎盖下”到底是怎么回事？

每次调用

setup（）

，都会在

#start

和

#stop

元素上创建额外的单击处理程序。当您实际单击

#start

或

#stop

时，将调用所有适用的处理程序（以绑定它们的相同顺序）。这就是为什么单击

#start

会同时播放

CMajor3

和

CMajor4

注释。您可以运行多个并发但不相关的间隔

如果将

intervalReturn

定义为全局变量，则只有最近调用

setInterval（）

返回的间隔ID，因为每次运行

#start

单击处理程序时，它都会覆盖上一个。这就是为什么单击

#stop

只能停止其中一个间隔，而无法停止其他间隔

在

setup（）

函数中移动

var intervalReturn

声明会有所帮助，因为方法是

setup（）

的参数和局部变量，即

time

、

pitchSet

和

intervalReturn

（移动声明后）可在当前调用

setup（）

中定义的两个事件处理程序中访问。对

setup（）

的后续调用使用这些变量各自的副本创建新闭包。因此，

#stop

单击处理程序使用与其自身的

设置（）相关的单个
intervalReturn
。由于两个
#stop
处理程序都在运行，因此两个间隔都被清除

但是您仍然存在一个问题，即多次单击
#开始#
而不单击
#停止
会创建额外的间隔，然后在任何一个
setup（）
中，单个
intervalReturn
会被最新的间隔覆盖，因此，
#stop
也无法返回到以前的间隔。这就是为什么在
#start
处理程序中添加
if（intervalReturn==null）
仅在尚未运行新间隔时才有助于启动新间隔的原因。（然后您需要在
#stop
处理程序中添加
intervalReturn=null
，因为只调用
clearIntervalreturn（intervalReturn）
不会更改
intervalReturn
变量的值。）

建议：将现有的
console.log（）语句更新为以下内容：

console.log("startClicked", pitchSet, intervalReturn); 
// and
console.log("stopClicked", pitchSet, intervalReturn); 

调用
setInterval（）
之后，
startclick
one可能会记录刚刚返回的间隔ID，而不是上一个。这样，您可以查看所有相关变量的值，并查看发生了什么。
问题是单个
intervalReturn
变量不能同时保存两个不同的值尝试移动
var intervalReturn=null
作为
函数设置的第一行
查看注释的编辑？“如果您…单击#多次启动，也会发生这种情况。”-这是您希望能够做到的吗？或者用户应该在再次单击开始之前停止上一个吗？如果（intervalReturn！==null）
您可以这样做，只要您在
#stop
函数中将其显式设置回
null
。哦，是的，对不起，您想要的是相反的，
如果（intervalReturn==null）
然后调用
setInterval（）
中的
#启动
功能，并在
中的
停止

中将其重置为

空

。换句话说，“如果还没有开始运行，那么就开始……”太棒了！非常感谢您的详细解释。这使我更清楚地了解我需要学习什么来理解这个项目。

console.log("startClicked", pitchSet, intervalReturn); 
// and
console.log("stopClicked", pitchSet, intervalReturn);