javascript - 静音隐藏的div(视频)html5

Question

我正在使用隐藏在网页上的视频 div，并使用 javascript 按键切换其可见性。当页面加载时，即使 div 被隐藏，我仍然可以听到声音。 1.div隐藏时可以静音吗？ 或者 2.当我切换div可见性时是否可以开始/停止播放？

$(document).keypress(function(e) {
  var key = e.which;
  if (key == 116) {
    // if the user pressed 't':
    $('div').toggle();
  }
});

提前致谢!

Answer 1

要给出完整答案，您应该确保您的 <video />标签没有 autoplay属性以防止页面加载后立即启动，并为其指定 id属性，以便您可以访问它。然后，当用户切换可见性以开始/暂停播放时，您可以使用一些基本的 JavaScript:

要玩，您可以:

document.getElementById('your-video-id').play(); 

并暂停:

document.getElementById('your-video-id').pause();

所以你的按键功能可以变成:

$(document).keypress(function(e) {
  var key = e.which;
  // Grab a reference to your video
  var video = document.getElementById('your-video-id');

   if (key == 116) {         
     // if the user pressed 't':
     $('div').toggle();

     // Check if the video is paused, if it is then play, if it's playing then pause.
    if(video.paused){
      video.play();
    } else {
      video.pause();
    }

   }
});