【问题标题】: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>
<% } %>

【问题讨论】:

    标签: html video frontend html5-video ejs


    【解决方案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,所以应该可以在任何地方工作,包括在你的循环内。它将为您提供用户单击的任何视频的源值。
    猜你喜欢
    • 2011-02-10
    • 2019-03-11
    • 2015-10-08
    • 2021-07-03
    • 2021-07-31
    • 2022-07-19
    • 2020-10-05
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多