簡易flv播放器,可用通過js控制flv播放,暫停。具體參考下面的示例說明,已經(jīng)做成jquery插件形式。
注意:要用js控制flv的播放停止,需要將示例發(fā)布后,通過http訪問,要不會報錯:uncaught exception: Error in Actionscript. Use a try/catch block to find error.Line 0
jquery.jflv.js示例及使用說明文檔
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>簡易flv播放器jquery.jflv.js</title><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><script type="text/javascript"> /***簡易flv播放器,可用通過js控制flv播放,暫停。 *方法 *PlayFLV(url):播放flv文件。參數(shù)url,flv的路徑 *PauseFLV():暫停flv播放。 *SetVol(v):設(shè)置播放器音量。0~100的數(shù)字,視頻音量默認(rèn)100 *事件名稱,對應(yīng)window作用域下的JS函數(shù)名稱 *GetFlvMeta(totalTime,bytesTotal):接受flv元數(shù)據(jù)事件。參數(shù)totalTime(總播放時間,單位秒),bytesTotal(視頻大小,單位字節(jié)) *Playing(totalTime,playheadTime):播放視頻過程事件,0.25s調(diào)用一次。參數(shù)totalTime(總播放時間,單位秒),playheadTime(當(dāng)前播放時間,單位秒) *Loading(bytesTotal,bytesLoaded):下載視頻過程事件,0.25s調(diào)用一次。參數(shù)bytesTotal(視頻大小,單位字節(jié)),bytesLoaded(已下載大小,單位字節(jié)) *PlayEnd():視頻播放結(jié)束事件。無參數(shù) 作者:Showbo http://www.w3dev.cn/ */ jQuery.fn.jflv = function (opts, p) {//opts:調(diào)用方法時為字符串,否則為JSON配置對象。p:調(diào)用方法時的參數(shù),url或者v,參考上面 if (opts === 'PlayFLV' || opts === 'PauseFLV' || opts === 'SetVol') //調(diào)用方法 return this.each(function () { var id = $(this).data('flvplayerid'); if (!id) return; //沒有初始化 var player = document[id] || window[id]; //獲得swf容器 player[opts](p); //調(diào)用方法 }); var playerpath = ""; var options = { //jflv配置 flvplayer: '/jflv.swf', //flv的swf播放器位置,默認(rèn)和當(dāng)前html頁面同目錄 width: 215, //flv播放器寬度 height: 145, //flv播放器高度 autoplay: false, //是否自動播放 //事件,說明參考上面,默認(rèn)缺省 GetFlvMeta: '', Playing: '', Loading: '', PlayEnd: '' }; if (opts) jQuery.extend(options, opts); var gpms = 'autoplay=' + options.autoplay + '&GetFlvMeta=' + options.GetFlvMeta + '&Playing=' + options.Playing + '&Loading=' + options.Loading + '&PlayEnd=' + options.PlayEnd; return this.each(function () { var filename = jQuery(this).html().toLowerCase(); //注意容器內(nèi)只放置flv的路徑,flv的路徑相對于flv swf播放器的位置,或者使用絕對路徑 if (filename.indexOf(".flv") == -1) return true; var flvplayID = 'player' + new Date().getTime(); //生成flv播放器的唯一id $(this).data('flvplayerid', flvplayID); //緩存id var pms = gpms + '&fn=' + filename; var flvhtml = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="' + flvplayID + '" '; flvhtml += 'width="' + options.width + '" height="' + options.height + '" '; flvhtml += 'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab">'; flvhtml += '<param name="movie" value="' + options.flvplayer + '?' + pms + '" />' flvhtml += '<param name="wmode" value="transparent" />'; flvhtml += '<embed allowScriptAccess="always" wmode="transparent" width="' + options.width + '" height="' + options.height + '" '; flvhtml += 'src="' + options.flvplayer + '?' + pms + '" '; flvhtml += 'type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" name="' + flvplayID + '" />'; flvhtml += '</object>'; jQuery(this).html(flvhtml); }); }; /*jquery.jflv.js測試代碼*/ function GetFlvMeta(totalTime, bytesTotal) { $('#dvLogs').append('總時間:' + totalTime + 's 文件大?。?#39; + bytesTotal + 'bytes<br>'); } function Playing(totalTime, playheadTime) { $('#dvLogs').append('當(dāng)前播放時間:' + playheadTime + 's<br>'); } function Loading(bytesTotal, bytesLoaded) { $('#dvLogs').append('已下載大小:' + bytesLoaded + 'bytes<br>'); } function PlayEnd() { $('#dvLogs').append('視頻播放完畢<br>'); } $(function () { $('span.jflv').jflv({ Playing: 'Playing', GetFlvMeta: 'GetFlvMeta', PlayEnd: 'PlayEnd',Loading:'Loading' }); $('input[type="button"]').click(function () { switch (this.value) { case '播放': $('span.jflv').jflv('PlayFLV'); break; case '暫停': $('span.jflv').jflv('PauseFLV'); break; case '關(guān)閉聲音': $('span.jflv').jflv('SetVol', 0); break; case '打開聲音': $('span.jflv').jflv('SetVol', 100); break; case '播放FLV視頻': $('span.jflv').jflv('PlayFLV', $('#txtUrl').val()); break; default: var i = $(this).prev(); if (i.val() == '') { alert('請輸入FLV視頻地址!'); i.focus(); return false; } $('span.jflv').jflv('PlayFLV', i.val()); } }); });</script></head><body><span class="jflv">http://www.hezhoubb.jcy.gov.cn/upload/video/20150816/215336800.flv</span><input type="button" value="播放" /> <input type="button" value="暫停" /> <input type="button" value="關(guān)閉聲音" /> <input type="button" value="打開聲音" />播放FLV視頻:<input type="text" id="txtUrl" style="width:500px" value="http://www.hezhoubb.jcy.gov.cn/upload/video/20150816/215336800.flv" /><input type="button" value="播放FLV視頻" /><div id="dvLogs"></div></body></html>
新聞熱點
疑難解答
圖片精選