如何从一系列循环元素中获取点击元素？

Posted 2023-05-07

【中文标题】如何从一系列循环元素中获取点击元素？

【英文标题】：How to get a clicked elements from the series of looped elements?

【发布时间】：2022-01-08 02:24:18

【问题描述】：

我有使用 ejs 模板引擎循环播放的视频，我想在针对特定视频元素时处理点击事件。

我想在用户循环点击视频时获得点击视频。

以下代码为例：

<% for(var i=0; i<100; i++  %>
<video>
<source src="assets/video.mp4">
<video>
<%  %>

【参考方案1】：

您可以检查视频上的点击事件并查看来源。

需要注意的一件事 - currentSrc 是在加载元数据后设置的。我怀疑这对您的用例来说没问题，但如果不是，您可以等待“onloadeddata”事件，然后再允许点击功能。

const videoElement = document.querySelector('video');

    videoElement.addEventListener(`click`, () => 
      console.log(`Clicked` + videoElement.currentSrc);
      videoElement.play(); //To continue playing the video
      )

<video autobuffer controls autoplay>
  <source src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4">
</video>

【讨论】：

确实如此，但是如果这些视频不止一个，那么它适用于单个视频，我只想播放使用 ejs 模板循环播放的数百个视频中丢失的点击视频。

以上是纯 javascript，所以应该可以在任何地方工作，包括在你的循环内。它将为您提供用户单击的任何视频的源值。