Question

我已经启动了jQuery插件，我希望在绑定的.duration事件中检索HTML5视频上的.currentTime和.on('click', )。

我正在努力在我的plugin.registerClick函数中捕获这些信息，这是我的代码：

(function ($) {

$.myPlugin = function (element, options) {

    var defaults = {
            videoOnPage: 0,
            dataSource: 'data/jsonIntervals.txt',
            registerClick: function () { }
    }

    var plugin = this;

    plugin.settings = {}

    var $element = $(element);
         element = element;

    plugin.init = function () {

        plugin.settings = $.extend({}, defaults, options);

        $element.on('click', plugin.registerClick);

        getJsonIntervals();
    }

    plugin.registerClick = function () {

        var duration = $('video').get(plugin.settings.videoOnPage).duration;

        console.log('duration: ' + duration);
    }

    var startTimes = [];
    var dataSet = false;

    var getJsonIntervals = function () {

        if (dataSet == false) {
                //calls a $.getJSON method.
                //populates startTimes
                //updates dataSet = true;
        };
    }

    plugin.init();

}

$.fn.myPlugin = function (options) {
    return this.each(function () {
        if (undefined == $(this).data('myPlugin')) {
            var plugin = new $.myPlugin(this, options);
            $(this).data('myPlugin', plugin);
        }
    })
};

})(jQuery);

$(function () {
    $('#button1').myPlugin();
});

这里是我的样本jsFiddle Click Here

Answer 1

似乎对我有用：

plugin.registerClick = function () {
  var video = $('video').get(0);            
  console.log('duration: ' + video.duration);
  console.log('currenttime: ' + video.currentTime);
}

http://jsfiddle.net/p4w040uz/2/

您需要先播放视频，然后点击按钮。浏览器必须首先检索元数据才能返回它。

您可以阅读的其他参考资料：

http://www.w3schools.com/tags/av_event_loadedmetadata.asp

http://www.w3.org/2010/05/video/mediaevents.html

jquery插件，DOM中的参考视频元素

1 个答案: