如何在没有 jQuery 的情况下将播放事件绑定到 AJAX 加载的视频？

Question

我知道如何处理每个元素都支持的点击事件。这样我就可以将它用于稍后使用 AJAX.

加载的内容

但是 play 事件似乎只针对 video 和 audio 标签。所以我不能在 body 上听它对吧？如何在没有 jQuery 的情况下向每个稍后加载 AJAX 的视频添加播放事件？

jQuerys on() 这样对吗？是否有 jQuery on() 函数的独立端口我可以用作模块？

document.body.addEventListener( 'mouseover', iframeEvent, false );
document.body.addEventListener( 'touchend', iframeEvent, false );
document.body.addEventListener( 'touchmove', iframeEvent, false );

function iframeEvent( ev ) {

    if ( ! ev.target ) {
        return;
    }

    const ele = ev.target;

    if ( ele.matches( 'iframe' ) ) {
        // do stuff
    }
}

Answer 1

<audio> 和 <video> 之类的事件不会冒泡到父元素，这就是通常的委托方案的原因

document.body.addEventListener( 'play', iframeEvent, false );

行不通。但是您可以通过将第三个参数传递给 true

来使用事件的 "capture phase"

document.body.addEventListener( 'play', iframeEvent, true);

这里有更多内容http://www.quirksmode.org/js/events_order.html

如何在没有 jQuery 的情况下将播放事件绑定到 AJAX 加载的视频？

How to bind play events to AJAX loaded videos without jQuery?

javascript

events

html5-video