2

我有两个 setInterval 实例。每个都在重复的时间间隔触发不同的函数（这两个函数是 title quarterNoteFunc和FourthNoteFunc）。QuarterNoteFunc的间隔是 600 毫秒。FourthNoteFunc的间隔为300 毫秒。这两个功能都以重复间隔触发不同的音频文件，从而创建基本的音乐节奏。两个函数调用之间的节奏最终在谷歌浏览器中“漂移”，使两个声音之间的节奏消失。我的问题是：

似乎即使基于浏览器的计时是垃圾，它们也应该是一种创建某种“硬”计时参考的方法，这样即使“全局”计时得到偏移，声音也会被锁定，从而保持声音同步。我认为分配相同的变量毫秒（下面的代码）会抑制这一点 - 但我错了。

（缩写）代码如下所示

毫秒 = 600;

QuarterNote = setInterval(QuarterNoteFunc, 毫秒);

第八注 = 设置间隔（第八注函数，毫秒/2）；

4

1 回答 1

1

可能最好的方法是使用一个始终有效的 1/8 音符间隔，然后每隔一个刻度调用四分音符：

// wrapped in a closure to allow for a private tickCount variable
// alternatively, you could use a more advanced object with start/stop methods, etc.
(function() {
    var tickCount = 0,
        tick = function() {
            eighthNoteFunc();
            if(tickCount %2 == 0) {
                quarterNoteFunc();
            }
            tickCount++;
        };

    setInterval(tick, 300);
})();

这确保了这些方法总是在同一个刻度上被调用。您还可以扩展它以支持半音符 ( tickCount % 4 == 0) 和全音符 ( tickCount % 8 == 0)。

这让我很感兴趣，所以我决定创建一个完整的示例（除了使用动画背景而不是音频）：http: //jsfiddle.net/SycBm/

这使您可以看到八分音符、四分音符和二分音符同步滴答作响，以及启动和停止计时器，并独立启用或禁用音符。

享受！

于 2012-05-27T06:11:00.500 回答