JW Player/ColorBox 回调未触发

Question

将 JW Player 与 ColorBox 和 jQuery 一起使用，回调似乎没有正确触发。下面是一个片段：

    $(".thumbnail").live('click', function(event) {

        event.preventDefault();

        var videoFile = $(this).attr('id');

        jwplayer('viewPort').setup({
                    'flashplayer': '../jwplayer/player.swf',
                           'file': 'data/' + videoFile,
                             'id': 'playerID',
                          'width': '100%',
                         'height': '100%',
                     'controlbar':'bottom',
            'controlbar.idlehide':'false',
                           'skin':'../jwplayer/skins/big.zip',
                        'plugins': {
                                    'gapro-2': { },
                                   },
                     'onComplete': function () {
                                      $("#colorBox").colorbox.close();
                                   }
        });

        $("#colorBox").colorbox({
               'width':"80%",
              'height':"80%",
          'transition':"fade",
           'scrolling':false,
              'inline':true,
                'href':"#viewPort",
                'open':true,
          'onComplete': function () {
                            jwplayer('viewPort').play();
                        },
            'onClosed': function () {
                            jwplayer('viewPort').remove();
                        }
        });

    });

未触发的是 jwplayer 和 colorbox 的 onComplete。

我可以在控制台 (Firebug) 中执行命令 $("#colorBox").colorbox.close(); 并且它确实关闭。与 jwplayer('viewPort').play(); 相同。

这可能是方法名称之间的冲突吗？因为 onClosed 触发得很好。

Answer 1

对于 JWPlayer，您应该将事件处理程序放在选项对象的 events 属性内：

jwplayer(...).setup({
    ...
    events : {
        onComplete : function () {
            console.log('Chicken\'s Done!');
        }
    }
});

以下是文档中描述如何注册事件处理程序部分的链接：http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/12540/javascript-api-reference#Events

我也不是熟悉 Colorbox，所以我不确定如何初始化它的回调，但文档指出您可以绑定到全局 onComplete 事件，如下所示：

$(document).bind('cbox_complete', function(){
    setTimeout($.colorbox.next, 1500);
});

来源：http://jacklmoore.com/colorbox/（靠近底部的是“事件挂钩”）