如何通过JavaScript检测视频是否静音？

Question

如何通过JavaScript检测视频是否静音？

3

到目前为止，我已经找到了如何检测音频元素是否暂停的方法。我可以使用下面的函数（顺便问一下，aud_play_pause函数是从哪里来的，我可以学到更多关于它的知识吗？）

function aud_play_pause()

然而，我不知道如何检测视频是否静音，我只有以下代码。通过“检测”，我的意思是这段代码可以自己运行，无需任何事件触发，如点击。

 if ( $("video").prop('muted') ) {
$("#m-v").removeClass('on').addClass('off');
 } else { 
$("#m-v").removeClass('off').addClass('on');
 };

这个，它们是一样的吗？

if (video.muted === true;) {    
$("#m-v").removeClass('on').addClass('off');
} else {
$("#m-v").removeClass('off').addClass('on');
 };

- X.L

请告诉我“aud_play_pause”函数在哪里？嗯？这不是你的代码吗？ - Heretic Monkey

1

也许您指的是来自此W3示例的aud_play_pause？ - Sᴀᴍ Onᴇᴌᴀ

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Sᴀᴍ Onᴇᴌᴀ · Accepted Answer

.prop()是jQuery的一个方法。html5 <video>标签确实有一个属性muted。因此，这两个代码示例都在检查相同的属性/属性。请参考this W3 page以获取所有事件和属性的列表。

在下面的示例中，我们使用jQuery的.on()将事件处理程序绑定到视频事件。函数checkMuteStatus使用您提供的代码并添加了一些调试输出行。它还使用$(document).ready())在绑定事件处理程序之前等待DOM加载。要了解更多关于事件委托的内容，请参阅this jQuery page。

$(document).ready(function() {
  $('#video').on('play pause ended timeupdate volumechange', checkMuteStatus);  
});

function checkMuteStatus() {
  var video = $('video');
  var videoById = document.getElementById('video')
  $('#console').append('prop: ', video.prop('muted') ? 'true' : 'false', ' .muted: ', videoById.muted ? 'true' : 'false', '<br />');
  if ($("video").prop('muted')) {
    $("#m-v").removeClass('on').addClass('off');
  } else {
    $("#m-v").removeClass('off').addClass('on');
  };
}

#m-v.on {
  color: #f00;
}
#m-v.off {
  color: #0f0;
}
.float {
  float: right;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<video src="http://mdn.github.io/learning-area/html/multimedia-and-embedding/video-and-audio-content/rabbit320.webm" controls="" id="video">
  <p>Your browser doesn't support HTML5 video. Here is a <a href="http://mdn.github.io/learning-area/html/multimedia-and-embedding/video-and-audio-content/rabbit320.webm">link to the video</a> instead.</p>
</video>
<div class="float">
  <div id="m-v" class="on">Mute Status</div>
  <div id="console"></div>
</div>

目前还不知道 aud_play_pause 的定义在哪里，但也许你正在查看类似于W3音频示例HTML/元素/音频的内容*