我可以让以下简单场景工作:页面上的一个 div,单击该 div 将在 FancyBox 的覆盖窗口中使用 JW Player 打开一个视频。这是一个精简的代码:
HTML:
<div>
<a class="play_video" href="#" rel="/bin/video.mp4">Click to Watch Video</a>
</div>
jQuery:
$(document).ready(function() {
$(".play_video").fancybox({
content: '<div id="video_container" style="width:640px;height:381px;">Loading the player ... </div> ',
afterShow: function()
{
var myVideo = $(".play_video").attr("rel");
jwplayer("video_container").setup({
flashplayer: "/bin/player.swf",
file: myVideo,
width: 640,
height: 380,
});
}
});
});
这是我的问题:如果我想显示两个 DIV,每个 DIV 播放不同的视频,我该如何更改行
myVideo = $(".play_video").attr("rel")
动态并选择正确 div 的 rel 属性。例如,第二个 div 看起来像:
<div>
<a class="play_video" href="#" rel="/bin/another_video.mp4">Click to Watch a different Video</a>
</div>
我希望这很清楚!谢谢您的帮助。