Невозможно выбрать видео

Question

Я пытаюсь отключить / включить звук моего видео.Но для начала, похоже, я не могу выбрать свое видео.Пробовали учебные примеры и ответы на похожие вопросы, но все они указывают на один и тот же способ выбора видео.Пожалуйста, посоветуйте, что здесь не так.Спасибо.

<!-- HTML -->
<button id="enableMute" onclick="enableMute()" type="button">Mute</button>
<button id="disableMute" type="button">Enable</button>
<button id="checkMute" type="button">Status</button><br>

<video id="myVideo" width="320" height="176" autoplay loop muted>
    <source src="video/trailer.mp4" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

<!-- JS -->
$(function() {
    // seems not being selected. Tried without hash and same result. 
    var vid = $("#myVideo"); 

    //alert works but clearly nothing happening with mute controls
    $("#enableMute").click(function(){
        alert("enableMute");
        vid.muted = true;
        vid.volume = 1.0;
    });

    //alert works but clearly nothing happening with mute controls
    $("#disableMute").click(function(){
        alert("disableMute");
        vid.muted = false;
        vid.volume = 1.0;
    });

    //if i click this button first, the alert is "alert undefined"
    $("#checkMute").click(function(){
        alert('alert: ' + vid.muted); 
    });
}); 

Answer 1

Видео выбирается и помещается в переменную.Использование .muted не сработает, и вам нужно использовать функцию jQuery .prop(), как я выяснил в этот вопрос .Это должно работать:

HTML

<button id="enableMute" onclick="enableMute()" type="button">Mute</button>
<button id="disableMute" type="button">Enable</button>
<button id="checkMute" type="button">Status</button><br>

<video id="myVideo" width="320" height="176" autoplay loop muted>
    <source src="video/trailer.mp4" type="video/mp4">
    Your browser does not support HTML5 video.
</video>

JavaScript

$(function() {
  // Video is being selected
  var vid = $("#myVideo");

  $("#enableMute").click(function() {
    alert("enableMute");
    vid.prop('muted', true);
    vid.prop('volume', 1.0);
  });

  $("#disableMute").click(function() {
    alert("disableMute");
    vid.prop('muted', false);
    vid.prop('volume', 1.0);
  });

  $("#checkMute").click(function() {
    alert('alert: ' + vid.prop('muted'));
  });
});

Чтобы увидеть его в действии с примером видео, перейдите по ссылке по этой ссылке .