HTML5视频播放器中的音频(静音/取消静音)控制

Question

我使用以下代码在HTML5播放器中显示视频和音频文件：

<video id="myvideo" controls muted>
<source src="path/to/video.mp4" type="video/mp4" />
<audio id="myaudio" controls>
<source src="path/to/audio.mp3" type="audio/mpeg"/>
</audio>
</video>
<script>
var myvideo = document.getElementById("myvideo");
var myaudio = document.getElementById("myaudio");
myvideo.onplay  = function() {myaudio.play(); myaudio.currentTime = myvideo.currentTime;}
myvideo.onpause = function() {myaudio.pause();}
</script>

问题是我无法控制音量控制(静音/取消静音、音量增大/减小(。它就是不起作用。不幸的是，我不知道正确的事件名称。

有人能帮我吗？

谢谢！

Answer 1

Muted没有一个简单的事件绑定，您需要做的是跟踪volumechange事件并检查muted属性

myvideo.onvolumechange = function() {
if (myvideo.muted) {
myaudio.pause();
}
}

参见https://www.w3.org/2010/05/video/mediaevents.html对于标准<video>标签可用的事件和属性的相当广泛的列表