javascript - 仅在 Chrome 中调试 jPlayer 初始化，在控制台中看不到网络或 js 错误

Question

这款流媒体 MP3 播放器已经正常工作了 8 个月。它在过去几周出现了一种奇怪的行为，但仅在 Chrome 中出现 - 首次单击网站上任何地方的任何“收听”链接都会产生预期的控制台输出并更改播放器区域中的 HTML，但不会启动流。在控制台中看不到网络 404、403 等。除了 Flash 回退投诉外，控制台中没有抛出任何 JS 错误，尽管在寻找文件的地方找到了文件，但它总是抛出......

在 IE、FF 或 Windows Safari 中未观察到此问题。

实时站点:http://itsneworleans.com/

示例链接:

<a href="#top" ajax-data="/audio/episodes/2014_03_21_587_hello-swelo.mp3" ajax-data-id="587" ajax-data-alt="Happy Hour: Hello Swelo" class="playerLink ">Listen</a>

jPlayer 初始化第 233 行 http://itsneworleans.com/js/main.js

$("#jquery_jplayer_1").jPlayer({
        supplied: "mp3",
        swfPath: "http://itsneworleans.com/js/jQuery.jPlayer.2.5.0",
        solution: "html,flash",
        wmode:"transparent",
        errorAlerts: true,
        ended: function () {
            console.log('ended event fired');
            $.getScript('/js/random_show.js.php');
        }
    });

点击功能来自http://itsneworleans.com/js/main.js第 245 行:

$("body").on('click', '.playerLink', function() {
    if ($(this).attr('ajax-data')) {
        console.log("Playing " + $(this).attr('ajax-data'));

         ga('send', 'pageview', {'page': $(this).attr('ajax-data'),'title': document.title});
         console.log("Sending to GA " + $(this).attr('ajax-data'));

        $("#jquery_jplayer_1").jPlayer("setMedia", {
            mp3: $(this).attr('ajax-data')
        }).jPlayer("play");
        var chunks = $(this).attr('ajax-data-alt').split(':');
        var title = chunks[0] + ':<br>' + chunks[1];
        $('#playerTitle').html(title);
        $('#poplink').attr('ajax-data', $(this).attr('ajax-data-id'));

         var playtime = $("#jquery_jplayer_1").data("jPlayer").status.currentTime;
         $.ajax({
          type: "POST",
          url: "/inc/pcnter.php",
          data: {e:$(this).attr('ajax-data-id'), t:playtime, p:0}
        });

        if ($('#player').css('display') != 'block') {
            $('#player').css('display', 'block');
            $('#player').animate({"height":"80px"}, 1000);
        }
    }
});

输出:

Playing /audio/episodes/2014_03_21_587_hello-swelo.mp3 main.js:247
Sending to GA /audio/episodes/2014_03_21_587_hello-swelo.mp3 main.js:250
jPlayer 2.5.0 : id='jquery_jplayer_1' : Error!
jPlayer's Flash fallback is not configured correctly, or a command was issued before the jPlayer Ready event. Details: undefined is not a function
Check your swfPath option and that Jplayer.swf is there.
Context: http://itsneworleans.com/js/jQuery.jPlayer.2.5.0/Jplayer.swf 

Answer 1

我添加了一个带有控制台输出的 ready() 函数。我发现它只在第二次点击 Listen 链接时触发。

根据该结果进行更多搜索后，我找到了 this post :

"check your styles. if your #jquery_jplayer_1 or its parent has display=none, ready event never fires in such browsers as opera or firefox. i mean flash object can't be hidden."

我不能说它以前为什么有效，但实际情况是 jPlayer 的 Flash 解决方案无法加载，因为我的播放器已将显示设置为无。

所以现在我通过一个负边距顶部来关闭屏幕外的播放器，而不是动画高度我动画边距顶部。现在一切正常。