javascript - mediaelement.js:监听从 mep-feature-ads 触发的事件

Question

我正在尝试使用 mediaelement.js 在我们的网站上播放视频。我们想在主视频之前展示广告视频。要跟踪哪个广告被查看了多少次，我想在广告结束时向我的自定义 php 脚本发送一个 ajax 调用。

我的问题是，我无法将监听器添加到 mep-feature-ads 所在的正确项目函数 adsPrerollEnded触发回调:

adsPrerollEnded: function() {
    console.log('adsPrerollEnded');

    var t = this;

    t.container.trigger('mejsprerollended');

    t.adRestoreMainMedia();
},

当时我的代码是这样的:

<script>
$(function() {
    $('audio,video').mediaelementplayer({
        features: ['playpause','progress','current','duration','volume','fullscreen','ads'],
        adsPrerollMediaUrl: '../media/echo-hereweare.mp4',
        success: function (mediaElement, domObject) {
            // add event listener
            mediaElement.addEventListener('mejsprerollended', function(e) {
                alert('ad is over, do ajax now');
            }, false);          

            // call the play method
            mediaElement.play();
        },
    });
});
</script>

但是永远不会触发警报，除此之外所有其他功能都可以正常工作(广告在主视频之前播放，并且在广告期间没有控件可用，在广告主视频开始之后)。

我认为 t.container来自广告功能与 mediaElement 不同在成功函数中。

关于 console.log() 的一些研究我想通了，t.container是<div id="mep_0"元素。 mediaElement是<video>标签埋在 class=mejs-inner和 class=mejs-mediaelement

那么我如何在 mejsprerollended 上注册一个监听器呢？ ？

Answer 1

我自己想通了:

mejs 正在使用 jquery .trigger 函数，所以我必须使用 jquery eventlistener-register-function .on:

var player = new MediaElementPlayer('#video',{
    features: ['playpause','progress','current','duration','volume','fullscreen','ads'],
    adsPrerollMediaUrl: '../media/echo-hereweare.mp4',
});
player.container.on('mejsprerollended',function(e){
    alert('ad is over!');
});