Question

我正在尝试从包含多个视频的页面获取当前视频源，它们由id分隔。

示例如下

<video id="videoOne"
controls src="videoOne.mp4"
</video>

<video id="videoTwo"
controls src="videoTwo.mp4"
</video>

我能够通过将0更改为1来播放哪些事件正在触发，以引用适当的视频我只需要能够通过jquery执行此操作但我不确定如何完成此操作

var current_source = $（'video'）[0] .currentSrc;

在以下jquery

中

var PodcastAnalytics = PodcastAnalytics || {};

// Wait for the video element to be parsed before attempting this.
$(document).ready(function(){

  // Wait until the video metadata has been loaded before we try to determine the current video source.
  $('video').on('loadedmetadata', function(){

    // Simple function to chop off the file extension for the current source of the video. 
    PodcastAnalytics.audio_url = (function(){
      var current_source = $('video')[0].currentSrc;
      return current_source.slice(0, -4);
    }());
    // function that sends the actual tracking beacon
    PodcastAnalytics.gaq_track = function(action) {
      // All events will be in the Video category
      var tracking_params = ['podcast','audio']
      // append the event action after the event method and the event category    
      tracking_params.push(action);
      // append the video url as the event label
      tracking_params.push(PodcastAnalytics.audio_url);

      // Replace this console.log with something like this if you are using Google Analytics:
      // _gaq.push(tracking_params);
      console.log(tracking_params);
    }

    $('video').on('play', function(){
      PodcastAnalytics.gaq_track('Play');
    });

    $('video').on('pause', function(){
      PodcastAnalytics.gaq_track('Pause');
    });

    $('video').on('seeked', function(){
      PodcastAnalytics.gaq_track('Seeked');
    });

    $('video').on('ended', function(){
      PodcastAnalytics.gaq_track('Ended');
    });

  });

});

Answer 1

我可能会离开，如果是的话，请告诉我，我会删除我的答案。
但是，我会尝试：

在外部绑定事件中，获取对视频对象的引用。
用它来查找你的current_src
继续使用它来执行其他事件绑定。

只是一个想法。

var PodcastAnalytics = PodcastAnalytics || {};

// Wait for the video element to be parsed before attempting this.
$(document).ready(function(){

  // Wait until the video metadata has been loaded before we try to determine the current video source.
  $('video').on('loadedmetadata', function(){
    // should 'this' refer to the video object?
    var $video = $(this); 

    // Simple function to chop off the file extension for the current source of the video. 
    PodcastAnalytics.audio_url = (function(){
      var current_source = $video.attr('currentSrc');
      // var current_source = $('video')[0].currentSrc;
      return current_source.slice(0, -4);
    }());
    // function that sends the actual tracking beacon
    PodcastAnalytics.gaq_track = function(action) {
      // All events will be in the Video category
      var tracking_params = ['podcast','audio']
      // append the event action after the event method and the event category    
      tracking_params.push(action);
      // append the video url as the event label
      tracking_params.push(PodcastAnalytics.audio_url);

      // Replace this console.log with something like this if you are using Google Analytics:
      // _gaq.push(tracking_params);
      console.log(tracking_params);
    }

    $video.on('play', function(){
      PodcastAnalytics.gaq_track('Play');
    });

    $video.on('pause', function(){
      PodcastAnalytics.gaq_track('Pause');
    });

    $video.on('seeked', function(){
      PodcastAnalytics.gaq_track('Seeked');
    });

    $video.on('ended', function(){
      PodcastAnalytics.gaq_track('Ended');
    });

  });

});

Answer 2

我使用以下jquery来获取正确的<video id=""/>但仍想知道是否可能以及如何获取currentSrc from e.target.id

$(document).ready(function($){

    $('video').on('loadedmetadata', function() {

            tracking = function(action,id, source) {

                var items = ['podcast','audio',action,id, source];

                console.log(items);
            };
        });

    $('video').off('play').on('play', function(e) {
            var idx = $(this).index();
            var currentSource = $('video')[idx].currentSrc;
            tracking('Play', e.target.id, currentSource);
        });

    $('video').off('pause').on('pause', function(e) {
        tracking('Pause', e.target.id);
    });

    $('video').off('seeked').on('seeked', function(e) {
        tracking('Seeked', e.target.id);
    });

    $('video').off('ended').on('ended', function(e) {
        tracking('Ended', e.target.id);
    });
});

jquery视频html5多视频定位

2 个答案: