使用JavaScript同时运行两个视频 [英] Run two videos at the same time with JavaScript

问题描述

点击使用JavaScript创建的播放按钮后，我想同时运行两个视频： https：/ /jsfiddle.net/Lrt7nqyn/

I would like run two videos at the same time after click on a play button that was created with JavaScript : https://jsfiddle.net/Lrt7nqyn/

目前，只有一个视频在运行。

At the moment, just one of videos run.

 <div class="player">
    <div class="mediaplayer">
      <video id="video1">
        <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4" />
      </video>
      <video id="video2">
        <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4" />
      </video>
  </div>
  <table>
    <tr>
      <th>Time</th>
      <td>
          <input class="time-slider" type="range" disabled value="0" step="any" />
      </td>
    </tr>
    <tr>
      <td>
          <input value="Play" type="button" class="play" />
      </td>
    </tr>
    <tr>
      <td>
         <input value="Stop" type="button" class="pause" />
      </td>
    </tr>
    <tr>
      <th>Mute</th>
      <td>
        <input class="muted" type="checkbox" />
      </td>
    </tr>
    <tr>
      <th>Volume</th>
      <td>
        <input class="volume-slider" type="range" value="1" max="1" step="0.01" />
      </td>
    </tr>
  </table>
</div>

推荐答案

试试这个：

JSfiddle： https://jsfiddle.net/1co0x58v/

JSfiddle: https://jsfiddle.net/1co0x58v/

$('input.play', player).bind('click',function () {
      $('video, audio', player)[0].play();
      $('video, audio', player)[1].play(); // add this line to play second video
});
$('input.pause', player).bind('click',function (){
      $('video, audio', player)[0].pause();
      $('video, audio', player)[1].pause(); // add this line to pause second video
});

这篇关于使用JavaScript同时运行两个视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！