Question

我想使用jquery或javascript动态加载jwplayer。我想这样做是因为未安装FLASH的浏览器jwplayer没有按预期运行。

因此我想首先检查是否安装了Flash播放器进入浏览器，如果是，我只想加载jwplayer。要检查安装的闪存与否，我在下面使用

var hashFlash=((typeof navigator.plugins != "undefined" && typeof navigator.plugins["Shockwave Flash"] == "object") || (window.ActiveXObject && (new ActiveXObject("ShockwaveFlash.ShockwaveFlash")) != false));

如果hashFlash为真，那么我只会加载jwplayer来播放视频/音频。

我使用下面的代码动态加载jwplayer。

function loadjwplayer(filename) {
    var fileref=document.createElement('script');
    fileref.setAttribute("type","text/javascript");
    fileref.setAttribute("src", filename);
    alert(fileref);
    document.getElementsByTagName("head")[0].appendChild(fileref);
}

或通过jquery如下

$.getScript("/jwplayer/jwplayer.js");

之后，我将根据需要在下面添加音频/视频播放器到我们的页面。

function load_jwplayer_skin( div_id, audio_file) { 
    jwplayer(div_id).setup({
                      file: audio_file,
                      flashplayer: "/jwplayer/jwplayer.flash.swf",    
                      primary: "flash",
                      width: "350", 
                      height: "25", 
                    });
}

并将其用于html，如下所示

<div id='audio_1'>......</div>
<script>
load_jwplayer_skin('audio_1','my_fev_song.mp3');
</script>

但是我得到了以下错误＆＃34; Uncaught Referenceerror：Jwplayer没有在函数load_jwplayer_skin＆＃34;中定义。

如果我在页面的头部使用.....加载jwplayer，同样工作正常。这似乎是jwplayer在全球范围内不可用。

请有人建议我如何继续。

Answer 1

试试这个：

function load_jwplayer_skin(div_id, audio_file) {
  if(!jwplayer) {
    if(!load_jwplayer_skin.oldCalls) {
      load_jwplayer_skin.oldCalls = [];
    }
    return load_jwplayer_skin.oldCalls.push({divId: div_id, file: audio_file});
  }
  else {

    load_jwplayer_skin.oldCalls.push({divId: div_id, file: audio_file});

    var oldCalls = load_jwplayer_skin.oldCalls,
    oldCallsLen = oldCalls.length,
    i = 0;

    for(i; i < oldCallsLen; i++) {
      var oldCall = oldCalls[i];
      doLoadJWPlayerSkin(oldCall.divId, oldCall.file);
    }

    delete load_jwplayer_skin.oldCalls;

    load_jwplayer_skin = doLoadJWPlayerSkin;
  }
}

function doLoadJWPlayerSkin(divId, audioFile) {
  jwplayer(divId).setup({
    file : audioFile,
    flashplayer : "/jwplayer/jwplayer.flash.swf",
    primary : "flash",
    width : "350",
    height : "25",
  });
}

它的工作原理如下，如果jwplayer没有准备就绪，那么参数就会被推送到数组中。一旦jwplayer准备就绪，它就会遍历数组中的所有项目。调用原始加载器doLoadJWPlayerSkin。最后，load_jwplayer_skin = doLoadJWPlayerSkin;确保将来对load_jwplayer_skin的调用定向到doLoadJWPlayerSkin。

就是这样。

更新

当浏览器开始读取html文件时，它开始呈现html内容。如果它遇到一个脚本块，它会立即执行它（这就是你的问题产生的地方）。如果遇到具有src属性的脚本，浏览器会告诉其他一些组件（您必须研究它）以加载脚本＆amp;继续加载页面的其余部分。

我想有了这些细节，你会明白哪里出了问题＆amp;这是为什么。

我会在这里解释一下。

在您的html中添加代码以加载jwplayer，我们假设代码位于head块中。
浏览器通知其他组件加载脚本＆amp;继续其html解析工作。
现在遇到一个脚本块＆amp;它执行脚本（因为，这是浏览器的本质）
该脚本块使用jwplayer。
假设jwplayer尚未加载。
因此，您收到的错误是jwplayer为undefined。

用我的方法（实际上，类似的东西被广泛用于不同的形式）

如果尚未加载jwplayer，则代码会将arguments存储在数组中。
您有许多调用load_jwplayer_skin函数的脚本块。
因此，在时间轴上，当jwplayer准备就绪时从其他一些脚本块中调用load_jwplayer_skin，那个时间load_jwplayer_skin调用doLoadJWPlayerSkin，并将每个先前的参数存储在数组中。
最后，它将doLoadJWPlayerSkin分配给load_jwplayer_skin。因此，将来对load_jwplayer_skin的调用将直接执行doLoadJWPlayerSkin。实际上这是某种形式的lazy initialization。

我的方法存在一个问题;那是 -

假设您开始加载jwplayer＆amp;所有load_jwplayer_skin函数调用都在jwplayer加载之前执行。现在什么都不会发生。

对于这种情况，我个人使用events。但你可以这样做，使用jQuery加载脚本＆amp;在.getScript来电load_jwplayer_skin的回调中。在其他地方，只需致电load_jwplayer_skin。试试这个，我相信你的问题将会得到解决。如果你想澄清任何事情，我在这里。

祝你好运！

动态加载jwplayer或任何js文件

1 个答案:

更新