JavaScript：根据预定义的时间线自动执行函数

我正在尝试构建一个web应用程序，根据预定义的时间自动为用户执行JS函数

例如：我在网页上有以下功能：

• 函数a（）{do stuff}

• 函数b（）{做一些其他事情}

• 函数c（）{do other stuff}

以及每个用户加载的JSON时间线：

"timeline":[
    {"ontime":" 00:00:00,000", "execute_func":"a"}, 
    {"ontime ":" 00:00:02,000", "execute_func":"b"}, 
    {"ontime ":" 00:00:07,000", "execute_func":"c"}, 
    {"ontime ":" 00:00:08,000", "execute_func":"a"}, 
    {"ontime ":" 00:00:13,000", "execute_func":"c"}
...
]

有没有办法根据这些函数在“时间线”中出现的顺序和时间自动触发它们

---

非常感谢您的帮助

JSON的第一个问题是，它不正确。您可以通过以下方式使其变得更好：

"timeline": [
  {"ontime": "00:00:00,000", "execute_func": "a"}, 
  {"ontime": "00:00:02,000", "execute_func": "b"}, 
  {"ontime": "00:00:07,000", "execute_func": "c"}, 
  {"ontime": "00:00:08,000", "execute_func": "a"}, 
  {"ontime": "00:00:13,000", "execute_func": "c"}
  ...
]

setTimeout(function () {
  // Execute every 1 second.
  // Get the current time.
  curTime = (new Date());
  var curTime = ("0" + curTime.getHours()).substr(-2) + ":" + ("0" + curTime.getMinutes()).substr(-2) + ":" + ("0" + curTime.getSeconds()).substr(-2);
  if (typeof getFunctionOnTime(curTime) == "function") {
    getFunctionOnTime(curTime)();
  }
}, 1000);

请注意键间距。。。ontime后面有一个空格，它不应该在那里

您需要设置一个计时事件处理程序函数，该函数每秒执行一次，如下所示：

"timeline": [
  {"ontime": "00:00:00,000", "execute_func": "a"}, 
  {"ontime": "00:00:02,000", "execute_func": "b"}, 
  {"ontime": "00:00:07,000", "execute_func": "c"}, 
  {"ontime": "00:00:08,000", "execute_func": "a"}, 
  {"ontime": "00:00:13,000", "execute_func": "c"}
  ...
]

setTimeout(function () {
  // Execute every 1 second.
  // Get the current time.
  curTime = (new Date());
  var curTime = ("0" + curTime.getHours()).substr(-2) + ":" + ("0" + curTime.getMinutes()).substr(-2) + ":" + ("0" + curTime.getSeconds()).substr(-2);
  if (typeof getFunctionOnTime(curTime) == "function") {
    getFunctionOnTime(curTime)();
  }
}, 1000);

getFunctionOnTime

函数将返回函数，否则返回false

function getFunctionOnTime(time) {
  for (var i = 0; i < timeline.length; i++) {
    if (timeline[i].ontime == time) {
      return (window[timeline[i].execute_func] || false);
    }
  }
}

函数getFunctionOnTime（时间）{
对于（变量i=0；i

---

上述函数假定在全局或

窗口

范围中声明了

execute_func

函数。这可能不是最完美的解决方案，但这是可行的。这有很大的优化范围。

好东西！！知道了。原因是我试图为视频创建一个覆盖，并在不同的提示下运行它。更进一步-是否可以暂停“设置超时”（在vid_pause（）…）并在几秒钟后重新播放？@wwyaron是的，您可以这样做。你愿意点击勾选按钮接受我的回答吗？我现在将添加暂停和恢复函数。步骤1：更改：

setTimeout（function（）{

到

var tmr=setTimeout（function（）{

）。步骤2：添加函数：

function pause（）{clearTimeout（tmr）；}

步骤3：添加函数：

function resume（）{tmr=setTimeout（function（）{…}，1000）；}