javascript - Video.js 动态加载 HTML

Question

首先我要说我的英语不是最好的。我正在尝试使用以下 javascript 代码加载 php 文件:

function reload() {
var id = <?=$id?>;
$('#vidid').load('other.php?&id='+id,true);

}

有了这个

<a href="#videodiv2" onclick="reload()" class="button">Mostrar envio</a>
<div id="vidid"> </div>

如果我将“other.php”的代码直接放在主页中，它可以工作，但如果我使用“function reload()”则不起作用。我搜索并找到了这个，所以按照我解释的方式做是不正确的 https://github.com/videojs/video.js/blob/master/docs/guides/setup.md

我读英文比写英文好XD。但我无法让它与该手册一起使用

videojs("example_video_1", {}, function(){
// Player (this) is initialized and ready.
});

这就是 javascript 代码吗？所以在“example_video_1”中我应该替换为“vidid”？并将“function()”替换为“function reload()”？我应该在//Player (this) 中写入的内容已初始化并准备就绪。注意:我使用 video.js 变体，可以显示 YouTube 视频 + 自动播放。

抱歉我的英语不好:S

<小时/>

感谢代码 BloodyKnuckles 它与 mp4 文件完美配合，但使用 YouTube 插件时显示“Se ha producido un errorintalo de nuevo màs tarde/已发生错误，请稍后重试”我使用代码的这个小变体你写的内容

<link type="text/css" rel="stylesheet" href="https://vjs.zencdn.net/4.5.1/video-js.css" />
<script src="https://vjs.zencdn.net/4.5.1/video.js"></script>
<script src="./src/youtube.js"></script>
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script>
function reload() {
$('#vidid source').attr('src', '<?=$id?>');
videojs("vidid", {}, function(){
    this.play();
});
} 
</script>

在 HTML 中

<video id="vidid" class="video-js vjs-default-skin" autoplay="autoplay" controls preload="auto" width="640" height="360" data-setup='{ "techOrder": ["youtube"] }'>

<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/youtube" />
</video><a href="#" onclick="reload(); return false;" class="button">Mostrar envio</a>

这与我在 other.php 中的类似，它工作正常...出现了 YouTube Logo ，但当我按下播放时，不起作用，并向我发送消息“已发生错误，请稍后再试” ...就像 URL/EMBED 不存在一样。但使用相同的文本/url“”，它可以在 other.php 中使用。但不是在“ajax”中。

Answer 1

试试这个:

function reload() {
    $('#vidid source').attr('src', 'other.php?&id=' + '<?=$id?>');
    videojs("vidid", {}, function(){
        this.load();
    });
}

假设 HTML 是:

<video id="vidid" class="video-js vjs-default-skin"
  controls preload="auto" width="640" height="264"
  poster="http://video-js.zencoder.com/oceans-clip.png">
    <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
</video>

<a href="#" onclick="reload(); return false;" class="button">Mostrar envio</a>

根据下面的评论进行更改。