0

我建立了一个页面，用户可以在其中输入一个以秒为单位的值，然后在该时间间隔内会发出 ping 声。我还组装了一个计时器，它应该与 ping 间隔同步。就像他们输入 5 一样 - 当 ping 响起时，时钟应该运行在 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);
 }
});
4

2 回答 2

0

这是因为JavaScript 中的计时器并不完全准确。请参见此处和此处。此外，由于 JavaScript 是单线程的，因此计时器仅在没有其他内容执行时才会执行。如果您的页面很忙，则实际上“计划”执行的内容会“延迟”。

于 2013-01-11T18:35:58.103 回答
0

使用下面的代码：

$(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);
 }
});

在该代码中，当代码更新时间时，它还会检查时间（您的seconds变量）是否有多​​个interval变量保持声音之间的时间间隔。注意interval是全局变量

于 2013-01-11T18:35:58.513 回答