MediaElement.js:如何获得播放时间的百分比(例如 90%)以计算完整的视觉视频

Question

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

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

提前致谢，祝您有美好的一天。

Answer 1

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

(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);

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

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

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