带谷歌分析的jPlayer播放列表

时间:2012-09-27 16:43:54

标签: javascript jquery jplayer

我正在使用jPlayer播放列表并需要帮助来添加Google Analytic事件以通过按播放按钮,点击播放列表中的标题,下一个来播放已播放的歌曲 或上一首,或在歌曲结束时前进。我试图通过API参考中所述的ID引用播放器,但我的控制台日志不会显示出来。为清楚起见,我已将此代码清理干净,以便不显示我的真实标题和网址

$(document).ready(function(){

var myPlaylist = new jPlayerPlaylist({
    jPlayer: "#jquery_jplayer_1",
    cssSelectorAncestor: "#jp_container_1"
}, [
    {
        title:"<Title Here>",

                    m4v: "<Link Here>",
        poster:" <Link Here> "
    },
           { 
        title:"<Title Here>",

                    m4v: " <Link Here> ",
        poster:" <Link Here> "
    },
    {
        title:" <Title Here> ",
        m4v: " <Link Here> ",
        poster: " <Link Here> "
    }
], {
    swfPath: "js",
                                 solution:"flash, html",
    supplied: "m4v "
});

$("#jquery_jplayer_1").jPlayer({
    ready: function() {
        console.log('here');
    },
    ended: function() {
        console.log('here');
    }
});
});

感谢任何帮助。

1 个答案:

答案 0 :(得分:1)

事件处理程序应该在jPlayerPlaylist构造函数的第三个参数中与“swfPath”等一起提供。所以在你的例子中,以下内容应该可以工作(我已经将播放列表参数重构为一个单独的变量以稍微代替代码):

$(document).ready(function() {
  var playlist = [
    {title: "<Title Here>", m4v: "<Link Here>", poster: "<Link Here>"},
    {title: "<Title Here>", m4v: "<Link Here>", poster: "<Link Here>"},
    {title: "<Title Here>", m4v: "<Link Here>", poster: "<Link Here>"}
  ];

  var myPlaylist = new jPlayerPlaylist({
    jPlayer: "#jquery_jplayer_1",
    cssSelectorAncestor: "#jp_container_1"
  }, playlist, {
    swfPath: "js",
    solution:"flash, html",
    supplied: "m4v",
    ready: function() {
      console.log('here');
    },
    ended: function() {
      console.log('here');
    }
  });
});