視頻處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>
點擊右邊列表,左邊刷新播放,開始的代碼:
$(document).ready(function(){ //點擊右邊列表的某個鏈接,視頻播放切換 $('#mod_videolist li').find('a').each(function(i, elem){ $(this).click(function(){ $('#mod_player > embed').attr('src', $(this).attr('href')); return false; }); //document.getElementById('evideo').play(); }); });
這樣只能切換embed的src值,但並不會切換播放(奇怪firefox能夠切換播放,其它瀏覽器只能改變了src),就是沒有觸發視頻的play動作,但因為不是html5的<video>標簽,embed標簽無法用js傳入play()方法,所以只能想別的方法,如下:
$(document).ready(function(){ //點擊右邊列表的某個鏈接,視頻播放切換 $('#mod_videolist li').find('a').each(function(i, elem){ $(this).click(function(){ $('#mod_player > embed').remove(); 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">'; $('#mod_player').html(str); return false; }); }); });
通過“摧毀”embed,然后再改變embed的src的動態值,重新生成embed,這樣就能兼容所有瀏覽器了。