JWplayer - 一页上的多个播放器答案

【问题标题】：JWplayer - multiple players on one pageJWplayer - 一页上的多个播放器
【发布时间】：2012-11-12 03:28:21
【问题描述】：

我在一页上有 3 个视频，但只加载了第一个视频。

我知道我必须为每个循环创建一个，但我不确定如何去做。谁能指出我正确的方向？谢谢

我的页面如下所示：

<script type="text/javascript" src="jwplayer.js"></script>


<div class="container">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container").setup({
flashplayer: "/jwplayer/player.swf",
file: "vid1.flv",
height: 270,
width: 480
});
</script>


<div class="container">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container").setup({
flashplayer: "/jwplayer/player.swf",
file: "vid2.flv",
height: 270,
width: 480
});
</script>


<div class="container">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container").setup({
flashplayer: "/jwplayer/player.swf",
file: "vid3.flv",
height: 270,
width: 480
});
</script>

【问题讨论】：

类选择器缺少.。
是的，我在 jwplayer.js 中找不到“容器”元素的引用位置，所以我无法更改它
你不应该使用 id 而不是 class 吗？
@sylv3rblade 是的，两者都试过了——结果相同

标签： javascript jquery video flash jwplayer

【解决方案1】：

好的，答案很简单……我只是给了 div 的个人名称：

EG：

<div id="container1">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container1").setup({
flashplayer: "/jwplayer/player.swf",
file: "vid1.flv",
height: 270,
width: 480
});
</script>


<div id="container2">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container2").setup({
flashplayer: "/jwplayer/player.swf",
file: "vid2.flv",
height: 270,
width: 480
});
</script>

【讨论】：

我也有同样的问题，也使用了你的“解决方案”，但这太荒谬了。对于 20 个视频（同一视频，页面上 20 次），加载时间非常缓慢，并且页面在播放器启动之前无响应。这不是一个可接受的解决方案。正在寻找另一个。
@Sumit 试试 JQuery Lazy Load 插件。如果您愿意，可以将其链接到一个活动 - 我在一个页面上有大约 20 个 YouTube 视频需要很长时间才能加载，因此链接延迟加载以在页面滚动时加载它们
不，我最终在叠加层中显示了所有视频，仅在打开叠加层时才启动它们。