embed标签动态改变Src的值，局部刷新播放其他视频的javascript方法

最新推荐文章于 2022-11-19 20:46:12 发布

原创最新推荐文章于 2022-11-19 20:46:12 发布 · 326 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

html 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种在非HTML5环境下实现Flash视频动态切换的方法。通过移除并重新创建embed元素来确保不同浏览器间的兼容性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

视频处html代码：

<div id="mod_player" class="mod_player"><embed id="evideo" src="http://static.video.qq.com/TPout.swf?vid=d0110upcugq&auto=1" allowfullscreen="true" quality="high" width="650" height="472" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash"></div>

点击右边列表，左边刷新播放，开始的代码：

   1:  $(document).ready(function(){

   2:   //点击右边列表的某个链接，视频播放切换

   3:    $('#mod_videolist li').find('a').each(function(i, elem){

   4:        $(this).click(function(){

   5:           $('#mod_player > embed').attr('src', $(this).attr('href'));

   6:           return false;

   7:        });

   8:        //document.getElementById('evideo').play();

   9:    });

  10:  });

这样只能切换embed的src值，但并不会切换播放（奇怪firefox能够切换播放，其它浏览器只能改变了src），就是没有触发视频的play动作，但因为不是html5的<video>标签，embed标签无法用js传入play()方法，所以只能想别的方法来曲线救国，如下：

   1:  $(document).ready(function(){

   2:    //点击右边列表的某个链接，视频播放切换

   3:    $('#mod_videolist li').find('a').each(function(i, elem){

   4:        $(this).click(function(){

   5:           $('#mod_player > embed').remove();

   6:           var str = '<embed id="evideo" src="'+ $(this).attr('href') +'" allowfullscreen="true" quality="high" width="650" height="472" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash">';

   7:           $('#mod_player').html(str);

   8:           return false;

   9:        });

  10:    });

  11:  });

通过“摧毁”embed，然后再改变embed的src的动态值，重新生成embed,这样就能兼容所有浏览器了。

出处：http://blog.163.com/wangzhongjiecool@126/blog/static/163019347201372055136269/