用純 Javascript 切換 HTML5 視頻靜音

Question

我正在嘗試使用自定義按鈕在不同視頻上切換靜音/取消靜音，而不使用 jQuery。 這是我的代碼：

const videoContainerCollection = document.getElementsByClassName('video-container'),
videoContainerArray = [...videoContainerCollection];
videoContainerArray.forEach(function(e) {
  const video = e.querySelector('video'),
  button = e.querySelector('button');
  video.muted = true;
  button.addEventListener('click', function() {
    button.classList.toggle('muted');
    if (video.muted = true) {
      video.muted = false;
    }
    else if (video.muted = false) {
      video.muted = true;
    }
  });
});

我可以取消靜音每個視頻，但我無法再次靜音。 我在這里做錯了什么？

Answer 1

const videoContainerCollection = document.getElementsByClassName('video-container'),
videoContainerArray = [...videoContainerCollection];
videoContainerArray.forEach(function(e) {
  const video = e.querySelector('video'),
  button = e.querySelector('button');
  video.muted = true;
  button.addEventListener('click', function() {
    button.classList.toggle('muted');
    if (video.muted === true) {
      video.muted = false;
    }
    else if (video.muted === false) {
      video.muted = true;
    }
  });
});