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是[{1}}和<video>

中隐藏的class=mejs-inner标记

那么如何在class=mejs-mediaelement注册听众？

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!');
});

mediaelement.js：收听由mep-feature-ads触发的事件

1 个答案: