Question

这是我的html页面的样子（测试）：

<div style="width: 640px;">
<object width="640" height="385"><param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zkd5dJIVjgM" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>
<ul>
    <li><a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI">Video 1</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=7o53S5JROfg">Video 2</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=e2ZB-1kDOdQ">Video 3</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=d-PDXAcUw0s">Video 4</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=vCH8O1dLSbc">Video 5</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=Q8kLlNt3Ue4">Video 6</a></li>
</ul>
</div>

我的jquery看起来像这样：

$('.btn').click(function(e){
e.preventDefault();
var val = $(this).attr("href");
$('embed').attr('src', val);
});

我想要做的是能够点击列表项中的每个链接，并让该视频重新播放当前的视频。因此，每次点击都会导致在顶部占据视频的不同视频。有人可以帮忙吗？

Answer 1

我不知道你是否解决了，无论如何问题可能是PARAM标签的VALUE属性中的URL格式与HREF属性中指定的格式不同。

<param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM">
<a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI">

我认为您应该将PARAM标记传递给具有正确格式的字符串，例如

http://www.youtube.com/v/VIDEO_ID_HERE

其实我没有测试过这个，但是你可以尝试一下。

Answer 2

如果添加以下内容，您应该使用的内容：

$('param[name=movie]').attr('value', val);

在没有页面重新加载的情况下动态交换Youtube视频

2 个答案: