Javascript 在播放页面上的另一个视频时禁用videoElements

我一直在做一个有14个短动画的调查。观看短动画后，您可以回答一个有关该动画的问题，对该片段的评分为0-5。在您观看该剪辑之前，收音机元素将被禁用，但现在我还想在播放一个剪辑时禁用其他视频元素。也就是说，否则你只需在屏幕上移动鼠标，视频就会在你“观看”了之后播放并启用，即使你没有真正注意到它们。我在论坛上看到了相关的问题，但它们是关于当你按play时停止另一个视频，这不是我想要的

我的代码是：

window.addEventListener('load', function() {
    var videoElements = document.getElementsByClassName("videos");
    var radioElements = document.querySelectorAll(".answer-item.radio-item input[type=radio]");

    // Disable alle radio elementen.
    for (let radioElement of radioElements) {
      // radio elements can't be clicked
      radioElement.setAttribute("disabled", "disabled");
    }

    // Add listeners voor alle video elementen.
     for (let videoElement of videoElements) {
          // On mouseover start the video.
      videoElement.addEventListener('mouseover', (event) => {
        var video = event.currentTarget;
        video.play();
        if (event.currentTarget.currentTime < 1){
            videoElements.setAttribute("disabled","disabled")
        }
      });

      // While playing, check if timestamp >  0.8, if so, enable the inputs.
      videoElement.addEventListener('timeupdate', (event) => {
        if (event.currentTarget.currentTime > 0.8) {
          // Zoek de index (hoeveelste video) van deze video.
          let index = Array.from(videoElements).indexOf(event.currentTarget);

          if (index !== -1) {
            // Zoek de 5 matchende radio elementen.
            let startIndex = index == 0 ? 0 : index * 5;
            let endIndex = startIndex + 5;
            let fiveRadioElements = Array.from(radioElements).slice(startIndex, endIndex);

            // Enable the 5 radio elements that belong to this video.
            for (let radioElement of fiveRadioElements) {
              radioElement.removeAttribute("disabled");
            }
          }
        }
      })
    }
});

window.addEventListener（'load'，function（）{
var videoElements=document.getElementsByClassName（“视频”）；
var radioElements=document.querySelectorAll（“.answer-item.radio-item输入[type=radio]”）；
//禁用所有无线电元件。
for（让radioElement为radioElement中的radioElement）{
//无法单击无线电元素
radioElement.setAttribute（“禁用”、“禁用”）；
}
//添加侦听器voor alle video elementen。
for（让videoElement中的videoElement）{
//在鼠标上方启动视频。
videoElement.addEventListener（'mouseover'，（事件）=>{
var video=event.currentTarget；
video.play（）；
如果（event.currentTarget.currentTime<1）{
videoElements.setAttribute（“禁用”、“禁用”）
}
});
//播放时，检查时间戳是否>0.8，如果是，则启用输入。
videoElement.addEventListener（'timeupdate'，（事件）=>{
如果（event.currentTarget.currentTime>0.8）{
//Zoek de index（hoeveelste视频）van deze视频。
让index=Array.from（videoElements）.indexOf（event.currentTarget）；
如果（索引！=-1）{
//Zoek de 5 matchende radio elementen。
设startIndex=index==0？0:index*5；
设endIndex=startIndex+5；
设fiveRadioElements=Array.from（radioElements）.slice（startIndex，endIndex）；
//启用属于此视频的5个无线电元素。
for（让放射性元素为五种放射性元素）{
radioElement.removeAttribute（“禁用”）；
}
}
}
})
}
});

---

提前谢谢

多亏了我的快乐链接，它被修复了。 有兴趣的人士：

window.addEventListener('load', function() {
    var videoElements = document.getElementsByClassName("videos");
    var radioElements = document.querySelectorAll(".answer-item.radio-item input[type=radio]");

    // Disable alle radio elementen.
    for (let radioElement of radioElements) {
      // radio elements can't be clicked
      radioElement.setAttribute("disabled", "disabled");
    }

    // Add listeners voor alle video elementen. --> this is in comments because we want the clip to continue playing at mouseout
    var isVideoPlaying = false;
    for (let videoElement of videoElements) {
      // On mouseover start the video.
      videoElement.addEventListener('mouseover', (event) => {
        var video = event.currentTarget;
        if (!isVideoPlaying) {
          video.play();
          isVideoPlaying = true;
        }
      });

      // While playing, check if timestamp > 0.8, if so, enable the inputs.
      videoElement.addEventListener('timeupdate', (event) => {
        if (event.currentTarget.currentTime > 0.8) {
          // Zoek de index (hoeveelste video) van deze video.
          let index = Array.from(videoElements).indexOf(event.currentTarget);

          if (index !== -1) {
            // Zoek de 5 matchende radio elementen.
            let startIndex = index == 0 ? 0 : index * 5;
            let endIndex = startIndex + 5;
            let fiveRadioElements = Array.from(radioElements).slice(startIndex, endIndex);

            // Enable the 5 radio elements that belong to this video.
            for (let radioElement of fiveRadioElements) {
              radioElement.removeAttribute("disabled");
            }

          }
        }
      });

      videoElement.addEventListener('ended', (event) => {
        isVideoPlaying = false;
      });
    }
  }); 

---

有一种方法可能在看到前一个视频之前不添加mouseOver eventListener？在您的情况下，在下一个索引中添加视频元素的侦听器，同时启用RadioElements，但我需要鼠标盖来启用第一个视频，这样我就不能将其移动到其他地方。另外，我不能将某个视频指定为第一个视频，因为没有第一个视频。我的意思是，我不能说：video1.onClick等，然后让其余的鼠标覆盖例如，为什么不添加验证，在启用一个视频之前，确保前面的无线电元素已应答或之前的视频已完全执行？似乎是合乎逻辑的，尽管我不熟悉这一点，您有任何示例吗？