Question

我正在尝试制作一个自定义视频播放器，但是当我尝试使用Javascript来播放和暂停视频时遇到了一个问题。我收到此错误：

未捕获的TypeError：无法在togglePlayPause处读取null的属性“ pause”

这是我的Javascript。 “ .video”是我的视频播放器，“。orange-juice”是我的进度/时间栏，“ play-pause”是我的播放和暂停按钮。

我还要提到我使用alert（）测试了它，但它似乎可以正常工作，所以我不太确定自己出了什么问题。

// VIDEO

var video = document.querySelector(".video");
var juice = document.querySelector(".orange-juice");
var btn = document.getElementById("play-pause");

function togglePlayPause() {
  if (video.paused) {
    btn.className = "pause";
    video.play();
  } else {
    btn.className = "play";
    video.pause();
  }
}

btn.onclick = function() {
  togglePlayPause();
};

Answer 1

无法找到您列出的元素。本质上，它什么也没点击。您需要解决这些元素及其各自的类/ id。

<video class="video orange-juice" />
<button id="play-pause">Play/Pause</button>

Answer 2

谢谢，但我明白了。原来我在html中缺少.video类（总是那一件小事情）。现在一切正常。谢谢！

无法让我的自定义播放按钮在我的视频播放器上正常工作

2 个答案: