Javascript jQuery定时器和声音不同步'；D

我构建了一个页面，用户可以在几秒钟内输入一个值，然后在该时间间隔内发出ping声。我还设置了一个计时器，它应该与ping间隔同步。比如，如果他们输入5，时钟应该运行超过5，10，15等。。。当砰的一声响起时。出于某种原因，我不明白，声音似乎与时钟不太同步，而且它运行的时间越长，情况就越糟。谢谢你的帮助

$(document).ready(function() {

  $('#set_ping').click(function() {
    interval = parseInt($('#ping_val').val()*1000,10);
    $('#ping_alert').text('The ping will sound every ' + interval/1000 + ' seconds.');
  });

  $('#go').click(function() {  
    timer();
    setInterval(sound, interval);

   });

  function sound() {
   $('#audio').append('<embed src="assets/audio/sound88.mp3" autostart="true" hidden="true" loop="false">');    
  }

  var seconds = 0;
  function timer() {setInterval(function() {
    $('#progress').text(seconds++/100);
  }, 10);
 }
});

$（文档）.ready（函数（）{
$（“#设置#ping”）。单击（函数（）{
区间=parseInt（$（'ping_val'）.val（）*1000,10）；
$（“#ping_警报”）.text（'ping将每隔“+间隔/1000+秒发出一次声音'）；
});
$（'#go'）。单击（函数（）{
定时器（）；
设置间隔（声音、间隔）；
});
函数声音（）{
$（'#audio'）。附加（''）；
}
var秒=0；
函数计时器（）{setInterval（函数（））{
$（“#进度”）.text（秒++/100）；
}, 10);
}
});
这是因为。也请参见和。此外，由于JavaScript是单线程的，计时器只在没有其他任何东西执行时执行。如果您的页面很忙，实际“计划”执行的内容将改为“延迟”。
使用下面的代码：

$(document).ready(function() {
var interval;
  $('#set_ping').click(function() {
    interval = parseInt($('#ping_val').val()*1000,10);
    $('#ping_alert').text('The ping will sound every ' + interval/1000 + ' seconds.');
  });

  $('#go').click(function() {  
    timer();
    setInterval(sound, interval);

   });

  function sound() {
   $('#audio').append('<embed src="assets/audio/sound88.mp3" autostart="true"     hidden="true" loop="false">');    
  }

  var seconds = 0;
  function timer() {setInterval(function() {
    $('#progress').text(seconds++/100);
    if(seconds % interval == 0){
       // play music here 
    } 
  }, 10);
 }
});

$（文档）.ready（函数（）{
var区间；
$（“#设置#ping”）。单击（函数（）{
区间=parseInt（$（'ping_val'）.val（）*1000,10）；
$（“#ping_警报”）.text（'ping将每隔“+间隔/1000+秒发出一次声音'）；
});
$（'#go'）。单击（函数（）{
定时器（）；
设置间隔（声音、间隔）；
});
函数声音（）{
$（'#audio'）。附加（''）；
}
var秒=0；
函数计时器（）{setInterval（函数（））{
$（“#进度”）.text（秒++/100）；
如果（秒百分比间隔==0）{
//在这里放音乐
} 
}, 10);
}
});

在该代码中，当代码更新时间时，它还会检查时间（您的
秒数
变量）是否为
间隔
变量的倍数，以保持声音之间的时间间隔。
注意
interval
是全局变量
为什么不嵌入它，不设置autoplay，将其设置为preload，并调用它来与JavaScript一起玩呢。胜过每次追加元素。