YouTube嵌入式播放器:动态更改javascript视频链接

时间:2010-04-12 14:18:29

标签: jquery youtube

以下是我的HTML代码的一部分(标有django-template语言变量的视频网址):

<div class="mainPlayer">
        <object width="580" height="326">
            <param name="movie" value="{{main_video.video_url}}"></param>
            <param name="allowFullScreen" value="true"></param>
            <param name="allowscriptaccess" value="always"></param>
            <embed src="{{main_video.video_url}}" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="580" height="326"></embed>
        </object>
    </div>

和JS代码(使用jQuery 1.4.x)

$(document).ready(function(){ .....
$(".activeMovie img").live("click", function(){
    video_url = ($(this).parent().find('input').val());
    $('.mainPlayer').find('param:eq(0)').val(video_url);
    $('.mainPlayer').find('embed').attr('src', video_url);
})
...
})

这样的算法在ff 3.6.3中运行良好,但在chrome4或opera 10.x.,srcvalue中没有运气改变,但youtube播放器仍显示旧视频。< / p>

3 个答案:

答案 0 :(得分:6)

我不会使用直接的YouTube代码,而是使用 swfobject 进行跨平台Flash嵌入。因此,如果您在此代码中有视频:

<div id='myvideo'></div>

要嵌入YouTube视频,请执行以下操作:

swfobject.embedSWF(&lt;&gt;,“myvideo”,“580”,“326”,“9.0.0”);

要更改视频,请在javascript中执行此操作:

swfobject.removeSWF("myvideo");
swfobject.embedSWF(<<new video url>>, "myvideo", "580", "326", "9.0.0");

swfobject(托管在谷歌代码上)负责处理所有跨平台闪存嵌入问题。

或者,您可以使用 YouTube JavaScript API 动态更改视频。

答案 1 :(得分:1)

尝试隐藏/显示标记。

$('div.mainPlayer object').hide().show();

这会在大多数浏览器中重新启动整个Flash影片。

答案 2 :(得分:0)

我认为你应该使用window.load而不是ready

$(window).load(function(){
   // .......
}