Question

以下是我当前的代码：https://jsfiddle.net/n7u4twb1/10/

当前的js代码：

app.module.ts

使用＆＃34;全部播放＆＃34;按钮我遇到滞后超过一半的时间。如何确保视频同时播放且没有延迟？它是在处理视频拼贴（多个视频）并将其转换为一个视频之前进行预览 - 我希望用户能够编辑每个视频开始的时间，但他们需要一种方法来在处理开始之前预览拼贴！提前致谢

Answer 1

如果每个视频都有一个按钮，请添加一个使用.click()方法的额外按钮。 .click()方法类似于jQuery .trigger()方法，在调用时会自动点击它绑定的任何内容。

演示

＆＃13;

var ui = document.forms.ui;
var btns = ui.elements;

btns[0].onclick = function(e) {
  play(0);
}

btns[1].onclick = function(e) {
  play(1);
}

btns.vSync.onclick = function(e) {
  btns[0].click();
  btns[1].click();
}

function play(idx) {
  var vids = Array.from(document.querySelectorAll('video'));
  var vid = vids[idx];
  if (vid.paused || vid.ended) {
    vid.play();
  } else {
    vid.pause();
  }
}

＆＃13;

<video src='https://storage04.dropshots.com/photos6000/photos/1381926/20170326/005609.mp4' width='240'></video>
<video src='https://storage04.dropshots.com/photos6000/photos/1381926/20170326/005609.mp4' width='240'></video>

<form id='ui'>
  <button data-id='0' type='button'>VIDEO A</button>
  <button data-id='1' type='button'>VIDEO B</button>
  <button id='vSync' type='button'>SYNC</button>
</form>

＆＃13;

如何确保2 <视频>在同一时间播放（没有延迟）？

1 个答案:

演示