Question

我知道可以像从本示例中那样从Brightcov动态加载Brightcov播放器：

https://codepen.io/team/rcrooks1969/pen/JywoKE （与播放器一起创建脚本标签，并实例化脚本的视频加载，类似） s.src = "//players.brightcove.net/{accountID}/{playerID}_default/index.min.js"; s.onload = callback;

我正在将多个视频加载到页面中，所有视频都被动态加载并使用同一播放器。是否有一种方法可以只加载一次脚本，但仍然可以使用videoJs('myPlayer')

我尝试修改示例，但videojs始终未定义， https://codepen.io/optionsit/pen/LBvXZm?editors=1011 （每个按钮应使用相同的播放器脚本加载不同的视频）

我也没有运气尝试使用Promises，解决对脚本的onload事件的承诺只会解决第一个视频。

Answer 1

您需要等到videojs加载完毕。只需禁用按钮即可，然后您可以执行以下操作：

s.onload = function() { 
  var btns = document.getElementByTagName('button');
  for (i = 0; i < btns.length;i++) {
    btns[i].disabled = false;
  }
  // or with jQuery simply $('button').prop('disabled', false);
}

Answer 2

如果您将initPlayer函数更改为使用bc()函数而不是videojs()来初始化播放器，则它将起作用。

initPlayer = function(player){
  // +++ Initialize the player and start the video +++
  myPlayer = bc(player);
  myPlayer.play();
}

我通过确定您的CodePen进行了测试。

动态加载Brightcove视频仅加载一次播放器

2 个答案: