Question

基本上我想要实现的是HTML中的音频播放器在点击播放按钮时播放音频和视频，反之亦然暂停。这是我的代码。

<div style="text-align:center"> 
<img src="img/playpause.jpg" onclick="playPause()">
  <br> 
  <video id="video1" width="1200" >
    <source src="pjds.mp4" type="video/mp4">
    <source src="pjds.ogg" type="video/ogg">
    Oops, your browser doesn't support me :(
  </video>
</div> 
<script>  
var myVideo = document.getElementById("video1"); 
function playPause() { 
    if (myVideo.paused) 
        myVideo.play(); 
    else 
        myVideo.pause(); 
} 
</script> 
<audio controls>
    <source src="ay.ogg" type="audio/ogg" onclick="playPause()">
    <source src="ay.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
</audio>

非常感谢任何帮助，谢谢。

Answer 1

试试这个：

     var myVideo = document.querySelector("video1"); 
     if (myVideo.get(0).paused) {
          myVideo.get(0).play();
     }
      else {
          myVideo.get(0).pause();
     }

Answer 2

最好通过示例进行描述：http://jsbin.com/zivak/1/edit

我设置了一个视频标签和一个音频标签，以及一个带onClick - 绑定的按钮。出于教育目的，我将控件保持可见，但它们应该被隐藏，因为它们会篡改您的状态。

单击按钮后，元素将从DOM中检索，然后play()被删除，如果暂停，则为pause()，否则为

。

请记住，onClick是单向的，可以这么说......

UPDATE ：是的，这是可能的，虽然它会变得复杂，因为两个标签可能必须独立缓冲，你必须小心同步它。这绝不容易......但http://jsbin.com/zivak/4/edit你是怎么想的呢？

更新：如果您的意思是“将音频静音，请将视频保持打开”，然后选择否。如果您的意思是“将音频静音，请将视频静音”，是的，这实际上非常简单：http://jsbin.com/zivak/5/edit。

遇到HTML音频/视频问题

2 个答案: