使用 JS 或 PHP = MediaElementJS 更改视频的 SRC答案

【问题标题】：Change SRC of a video using JS or PHP = MediaElementJS使用 JS 或 PHP = MediaElementJS 更改视频的 SRC
【发布时间】：2018-09-16 15:37:15
【问题描述】：

下午好。当用户单击带有 img 的 div 时，我正在尝试更改我的视频播放器 MediaElement.Js 的视频源，示例：

<a href="http://dns:port/hls/125.m3u8"><div id="change_channel><img src="https://www.example.com/img_chh/fox.png"></div></a>

我发现了一些其他用户想要更改 html5 视频源但只有两个流的答案。我遇到的问题是我有 +400 个流，并且其他用户的答案的代码行不再工作......

我尝试运行此代码，但没有成功：

<a href="http://dns:port/live/123.m3u8" onclick="
  playerObject.pause();
  playerObject.setSrc(this.href);
  playerObject.media.load();
  playerObject.load();
  return false
"><div id="change_channel><img src="https://www.example.com/img_chh/fox.png"></div></a>

我会将完整的代码留在 codepen 中以便调试它比下载所有文件来运行 MediaElement.js 更容易。 https://codepen.io/Hacker_D/pen/vzzKgM 如果有人知道如何解决这个问题，我将不胜感激。问候，DiX

【问题讨论】：

标签： javascript php html5-video src mediaelement.js

【解决方案1】：

首先，给定的代码当然不起作用，因为playerObject 没有引用任何东西，如果它是指<video> 元素，那么playerObject.media.load(); 行是无效的，因为没有Audio/Video DOM element 上的此类属性。至少在某个地方初始化它（给你的<video>标签和id，然后在某个地方做playerObject = document.getElementById(<the id of your video element>);。

我将您放入问题的链接分叉并修复了 javascript (https://codepen.io/anon/pen/gddogL)，但由于视频 url 无效，它无法播放，但它不再有任何 javascript 错误。因此，如果您有有效的视频网址，您至少可以修改它。

至于视频的数量，由于您标记了 php，因此只需创建一个通用的 javascript 函数，该函数获取源并将其设置给播放器，并且在生成页面时，只需将正确的源放入每个点击处理程序中。

【讨论】：

@DiX 没问题:)