mediaelement.js - MediaElement.js：如何获得播放时间百分比（ej。90％）以计算完整的视觉视频

Question

我需要计算观看视频的次数，但当达到 90% 时。

那么，我怎样才能得到这个百分比或读取总时间和观看时间。

在此先感谢，祝您有美好的一天。

Answer 1

这是一些工作代码，在此示例中，我将观看视频的次数保存到本地存储。

(function($) {
    $(document).ready(function() {
        $('video').mediaelementplayer({
            success: function (mediaElement, domObject, player) {
                var duration;
                var player_counted = false;
                var i = 0;

                //lets see that it works!
                console.log(localStorage[domObject.src+'_times_watched']);

                //after metadata is loaded we can access the duration
                mediaElement.addEventListener('loadedmetadata', function(e) {
                    duration = mediaElement.duration;
                });

                //check if video is seen (above 90%) and increase times watched counter
                mediaElement.addEventListener('timeupdate', function(e) {
                    if((mediaElement.currentTime / duration) >= 0.9) {
                        if(!player_counted) {
                            if (localStorage.getItem(domObject.src+'_times_watched') !== null) {
                                i = parseFloat(localStorage[domObject.src+'_times_watched']);
                            }
                            localStorage[domObject.src+'_times_watched'] = ++i;
                            player_counted = true;
                        }
                    }
                }, false);
            }
        });
    });
})(jQuery);

如果您不想使用本地存储，请将其替换 - 并保存到 cookie/db 或您需要的任何内容。

如果您决定使用 localstorage - 您可能还想检查 localstorage 支持，if (Modernizr.localstorage) {如果您不使用modernizr，我会使用 Modernizr 查看modernizr 源或搜索 SO。

如果您可以访问观看视频的每个用户的某些唯一标识符（即：登录 ID/电子邮件），请确保在之前添加该标识符，domObject.src+'_times_watched'以确保对同一浏览器上的多个用户进行正确计数。