Question

我有一个video元素，例如

<video controls>
  <source src="foo.ogg" type="video/ogg">
  <source src="foo.mp4" type="video/mp4">
  Your browser does not support the <code>video</code> element.
</video>

我需要混合一个音频文件，以便当用户启动视频时，音频文件与视频一起播放，当电影停止/倒回时，音频也会这样做。我没有在HTML5视频/音频API中找到任何可以让我这样做的功能。有谁知道这是否可能？

我想我可以在页面上有两个独立的元素，一个用于视频，一个用于音频，并由一个拦截来自视频播放器的事件的脚本控制，但我想也许有一种方法可以使用API？我知道对于音频我可以混合不同的文件，但我可以对视频做同样的事情吗？

Answer 1

您必须收听events的{{1}}。在您的情况下，这应该是html5 video play pause和ended here is an example player，其中列出了所有事件。

seeking

在黑暗中寻找。收听//HTML <video id="videoInHTML" width="320" height="240" controls="controls">..... //Javascript var yourVideoElement = document.getElementById("videoInHTML"); yourVideoElement.addEventListener('play', videoPausePlayHandler, false); yourVideoElement.addEventListener('pause', videoPausePlayHandler, false); function videoPausePlayHandler(e) { if (e.type == 'play') { // play your audio } else if (e.type == 'pause') { // pause your audio } }活动。如果玩家正在寻求=真 - > yourAudioFile.seekToTime（yourVideoElement.currentTime）

Answer 2

我不是很好。但是这些代码对我很有用，它也适用于你。

<!DOCTYPE>
<meta charset="UTF-8">
<title> audio video</title>

<audio id="audioInHTML" controls="controls">     
<source src="audio.wav" type="audio/wav"/>
</audio>
</div>

<video id="videoInHTML" width="320" height="240" controls="controls">
  <source src="movie.mp4" type="video/mp4" />
</video>

<div id="playButtonDiv" </div>

<form>
<input type="button" value="PlaySoundAndVideo" onClick="PlaySoundAndVideo('videoInHTML'),PlaySoundAndVideo('audioInHTML')">

</div>

<script>

function PlaySoundAndVideo(soundObj,videoObj) {
var soundAndVideo=document.getElementById(soundObj,videoObj);
soundAndVideo.play();
}


</script>

<style type="text/css">


#playButtonDiv {
position:absolute;
top:800px;

};   

</style>

如何将音频混合到html5视频？

2 个答案: