Discuz功能改進-用mejs播放器来替代失效的Discuz播放器
最近再用個人空間的時候，發現Discuz播放器不能使用，剛好這邊天香老師也有針對這部分做一個修正及調整。
※本人只翻譯成繁體中文，並修正部分文句讓臺灣這邊Discuz站長可以看更清楚，可能在修正文句上並不完美，請見諒。
※本文經過天香老師同意轉載並修正文句，若要再轉載修正文句，請先經過原作者同意，尊重原作者，原作者保留修改及調整權利。
１。 替換音樂播放器
a）替換論壇中的音樂播放器
需要改動的代碼在文件source/function/function_discuzcode.php 裡，將函數parseaudio 中的下面這句
※檔案部分，目前是採用彼岸網來源，看後續是否有人需要下載下來觀看，我這邊會再另外找一個空見放看看，但是這個礙於要占用所以目前不考量。
HF:小說明，初次使用之後確實替換了Discuz原始播放器，但是這邊要注意一件事情會出現一個小錯誤，你會無法找到js相關檔案，這邊需要至後台>全局>性能優化，將js緩存目錄更改至默認目錄 static/js/，這樣就不會出現錯誤了。
出處:彼岸網
作者:天香公主
翻譯及修改部分文句:HF
原網址:點我
※本人只翻譯成繁體中文，並修正部分文句讓臺灣這邊Discuz站長可以看更清楚，可能在修正文句上並不完美，請見諒。
※本文經過天香老師同意轉載並修正文句，若要再轉載修正文句，請先經過原作者同意，尊重原作者，原作者保留修改及調整權利。
幾年前Discuz因為安全原因撤下了三款基於Flash的播放器：個人空間裡播放音樂盒的mp3player.swf，播放mp3音樂的player.swf， 和播放flv格式的Flash文件的flvplayer.swf，使得Discuz網站上音樂盒，mp3音樂，和flv格式的Flash動畫無法照常使用。 至今尚未解決。 所以本文討論下如何用一個叫MediaElement.js （簡稱mejs）的html5播放器來替代上述失效的三種播放器。
首先我們要做些準備工作：將jQuery庫和mejs庫下載到網站上。 然後要修改文件template/default/common/header_common.htm，在它的最後添加
| Before | After |
 |  |
首先我們要做些準備工作：將jQuery庫和mejs庫下載到網站上。 然後要修改文件template/default/common/header_common.htm，在它的最後添加
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left"><script type=text/javascript src=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp;u=http://www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Djquery.min.js&amp;usg=ALkJrhjh4lGL3Tc76gRWcaUPsNUlUqeF8A></script> <script type=text/javascript src=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp;u=http://www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Dmediaelement/mediaelement-and-player.min.js&amp;usg=ALkJrhiX4Z8rH5TVxOUCe-1ZAoCT5NTfkg></script> <link rel=stylesheet href=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp;u=http://www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Dmediaelement/mediaelementplayer.min.css&amp;usg=ALkJrhjmBdZKiwTJ9OHinFNa2sGQ-c9V9g /> <script type=</span> <script type=text/javascript src=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp ;u=http://www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Djquery.min.js&amp;usg=ALkJrhjh4lGL3Tc76gRWcaUPsNUlUqeF8A></script> <script type=text/ javascript src=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp;u=http:/ /www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Dmediaelement/mediaelement-and-player.min.js&amp;usg=ALkJrhiX4Z8rH5TVxOUCe-1ZAoCT5NTfkg></script> <link rel= stylesheet href=https://translate.googleusercontent.com/translate_c?depth=1&amp;pok=1&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=zh-TW&amp;u=http:/ /www.bian-wang.com/discuz/%257B%24_G%5Bsetting%5D%5Bjspath%5D%257Dmediaelement/mediaelementplayer.min.css&amp;usg=ALkJrhjmBdZKiwTJ9OHinFNa2sGQ-c9V9g /> <script type=</span> <span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">text/javascript> var jqm = jQuery.noConflict(true); </script></span> text/javascript> var jqm = jQuery.noConflict(true); </script></span>
這裡我們假定網站將jQuery庫放在statis/js，將meja庫放在static/js/mediaelement，不然要改動上面的代碼指向實際地址。上面這句jQuery代碼的作用見我前文（ 鏈接 ）第二部分裡的說明。
１。 替換音樂播放器
a）替換論壇中的音樂播放器
| 設置界面 | 舊播放器 | 新播放器 |
|---|---|---|
 |  |  |
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">return '<span id="'.$randomid.'"></span><script type=text/javascript reload=1>$(\''.$randomid.'\').innerHTML=AC_FL_RunContent(\'FlashVars\', \'soundFile='.urlencode($url).'\', \'width\', \'290\', \'height\', \'24\', \'allowNetworking\', \'internal\', \'allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/player.swf\', \'quality\', \'high\', \'bgcolor\', \'#FFFFFF\', \'menu\', \'false\', \'wmode\', \'transparent\', \'allowNetworking\', \'internal\');</script>';</span> return '<span id="'.$randomid.'"></span><script type=text/javascript reload=1>$(\''.$randomid.'\').innerHTML=AC_FL_RunContent(\' FlashVars\', \'soundFile='.urlencode($url).'\', \'width\', \'290\', \'height\', \'24\', \'allowNetworking\', \'internal\', \'allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/player.swf\', \'quality\', \'high \', \'bgcolor\', \'#FFFFFF\', \'menu\', \'false\', \'wmode\', \'transparent\', \'allowNetworking\', \'internal\ ');</script>';</span>
改為
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">return '<audio id="'.$randomid.'" controls preload type=audio/mp3 width=290 src="'.$url.'"></audio><script type=text/javascript>jqm("#'.$randomid.'").mediaelementplayer();</script>';</span> return '<audio id="'.$randomid.'" controls preload type=audio/mp3 width=290 src="'.$url.'"></audio><script type=text/javascript>jqm(" #'.$randomid.'").mediaelementplayer();</script>';</span>
b）替換日誌中的音樂播放器
需要改動的代碼在文件source/function/function_blog.php 裡，將函數blog_flash 中的下面這段
需要改動的代碼在文件source/function/function_blog.php 裡，將函數blog_flash 中的下面這段
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$swf_url = urlencode(str_replace('&amp;', '&', $swf_url)); $html = '<object id=audioplayer_SHAREID height=24 width=290 data="'.STATICURL.'image/common/player.swf" type=application/x-shockwave-flash> <param value="'.STATICURL.'image/common/player.swf" name=movie /> <param value="autostart=yes&bg=0xCDDFF3&leftbg=0x357DCE&lefticon=0xF2F2F2&rightbg=0xF06A51&rightbghover=0xAF2910&righticon=0xF2F2F2&righticonhover=0xFFFFFF&text=0x357DCE&slider=0x357DCE&track=0xFFFFFF&border=0xFFFFFF&loader=0xAF2910&soundFile='.$swf_url.'" name=FlashVars /> <param value=high name=quality /> <param value=false name=menu /> <param name=allowscriptaccess value=never> <param name=allowNetworking value=internal> <param value=#FFFFFF name=bgcolor /> </object>';</span> $swf_url = urlencode(str_replace('&amp;', '&', $swf_url)); $html = '<object id=audioplayer_SHAREID height=24 width=290 data="'.STATICURL.'image/common/player. swf" type=application/x-shockwave-flash> <param value="'.STATICURL.'image/common/player.swf" name=movie /> <param value="autostart=yes&bg=0xCDDFF3&leftbg=0x357DCE&lefticon=0xF2F2F2&rightbg= 0xF06A51&rightbghover=0xAF2910&righticon=0xF2F2F2&righticonhover=0xFFFFFF&text=0x357DCE&slider=0x357DCE&track=0xFFFFFF&border=0xFFFFFF&loader=0xAF2910&soundFile='.$swf_url.'" name=FlashVars /> <param value=high name=quality /> <param value=false name=menu /> <param name=allowscriptaccess value=never> <param name=allowNetworking value=internal> <param value=#FFFFFF name=bgcolor /> </object>';</span>
改為
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">return '<audio id=audioplayer_SHAREID controls preload type=audio/mp3 width=290 src="'.$swf_url.'"></audio><script type=text/javascript>jqm("#audioplayer_SHAREID").mediaelementplayer();</script>';</span> return '<audio id=audioplayer_SHAREID controls preload type=audio/mp3 width=290 src="'.$swf_url.'"></audio><script type=text/javascript>jqm("#audioplayer_SHAREID").mediaelementplayer( );</script>';</span>
c）替換分享中的音樂播放器
需要改動的代碼在文件static/js/home.js 裡，將函數showFlash 中的下面這句
 |  |
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var musicFlash = '<object id=audioplayer_SHAREID height=24 width=290 data="' + STATICURL + 'image/common/player.swf" type=application/x-shockwave-flash>' + '<param value="' + STATICURL + 'image/common/player.swf" name=movie />' + '<param value=autostart=yes&bg=0xCDDFF3&leftbg=0x357DCE&lefticon=0xF2F2F2&rightbg=0xF06A51&rightbghover=0xAF2910&righticon=0xF2F2F2&righticonhover=0xFFFFFF&text=0x357DCE&slider=0x357DCE&track=0xFFFFFF&border=0xFFFFFF&loader=0xAF2910&soundFile=FLASHADDR name=FlashVars />' + '<param value=high name=quality />' + '<param value=false name=menu />' + '<param value=#FFFFFF name=bgcolor />' + '</object>';</span> var musicFlash = '<object id=audioplayer_SHAREID height=24 width=290 data="' + STATICURL + 'image/common/player.swf" type=application/x-shockwave-flash>' + '<param value="' + STATICURL + 'image/common/player.swf" name=movie />' + '<param value=autostart=yes&bg=0xCDDFF3&leftbg=0x357DCE&lefticon=0xF2F2F2&rightbg=0xF06A51&rightbghover=0xAF2910&righticon=0xF2F2F2&righticonhover=0xFFFFFF&text=0x357DCE&slider=0x357DCE&track=0xFFFFFF&border=0xFFFFFF&loader= 0xAF2910&soundFile=FLASHADDR name=FlashVars />' + '<param value=high name=quality />' + '<param value=false name=menu />' + '<param value=#FFFFFF name=bgcolor />' + '</object>';</span>
改為
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var musicFlash = '<audio id=audioplayer_SHAREID controls preload autoplay type=audio/mp3 src="' + flashvar + '"></audio><script type=text/javascript>jqm("#audioplayer_SHAREID").mediaelementplayer({ audioWidth: 290 });</script>';</span> var musicFlash = '<audio id=audioplayer_SHAREID controls preload autoplay type=audio/mp3 src="' + flashvar + '"></audio><script type=text/javascript>jqm("#audioplayer_SHAREID").mediaelementplayer({ audioWidth: 290 });</script>';</span>
再在同一個函數里稍後的這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">flashObj.innerHTML = flashHtml;</span> flashObj.innerHTML = flashHtml;</span>
後加上
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">// http://stackoverflow.com/questions/2592092/executing-script-elements-inserted-with-innerhtml var codes = flashObj.getElementsByTagName("script"); for (var i = 0; i < codes.length; i++) eval(codes[i].text);</span> // http://stackoverflow.com/questions/2592092/executing-script-elements-inserted-with-innerhtml var codes = flashObj.getElementsByTagName("script"); for (var i = 0; i < codes.length; i++) eval(codes[i].text);</span>
最後再將函數stopMusic 裡的這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$(musicFlash).SetVariable('closePlayer', 1);</span> $(musicFlash).SetVariable('closePlayer', 1);</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$(musicFlash).player.pause();</span> $(musicFlash).player.pause();</span>
２。 替換視頻播放器
a）替換論壇中的視頻播放器在頁面上有兩個地方可以添加flv視頻：
需要改動的代碼在文件source/function/function_discuzcode.php 裡，將函數parsemedia 中的下面這句
a）替換論壇中的視頻播放器在頁面上有兩個地方可以添加flv視頻：
 |  |
| 舊播放器 | 新播放器 |
|---|---|
 |  |
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">return '<span id="'.$randomid.'"></span><script type="text/javascript" reload="1">$(\''.$randomid.'\').innerHTML=AC_FL_RunContent(\'width\', \''.$width.'\', \'height\', \''.$height.'\', \'allowNetworking\', \'internal\', \'allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/flvplayer.swf\', \'flashvars\', \'file='.rawurlencode($url).'\', \'quality\', \'high\', \'wmode\', \'transparent\', \'allowfullscreen\', \'true\');</script>';</span> return '<span id="'.$randomid.'"></span><script type="text/javascript" reload="1">$(\''.$randomid.'\').innerHTML= AC_FL_RunContent(\'width\', \''.$width.'\', \'height\', \''.$height.'\', \'allowNetworking\', \'internal\', \' allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/flvplayer.swf\', \'flashvars\', \'file='.rawurlencode($url) .'\', \'quality\', \'high\', \'wmode\', \'transparent\', \'allowfullscreen\', \'true\');</script>';</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">return '<video id="'.$randomid.'" controls preload width="'.$width.'" height="'.$height.'" src="'.$url.'" ></video><script type="text/javascript">jqm("#'.$randomid.'").mediaelementplayer();</script>';</span> return '<video id="'.$randomid.'" controls preload width="'.$width.'" height="'.$height.'" src="'.$url.'" ></video ><script type="text/javascript">jqm("#'.$randomid.'").mediaelementplayer();</script>';</span>
b）替換日誌中的視頻播放器
需要改動的代碼在文件source/function/function_blog.php 裡，將函數blog_flash 中的下面這段
需要改動的代碼在文件source/function/function_blog.php 裡，將函數blog_flash 中的下面這段
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$html = '<span id="'.$randomid.'"></span><script type="text/javascript" reload="1">$(\''.$randomid.'\').innerHTML=AC_FL_RunContent(\'width\', \''.$width.'\', \'height\', \''.$height.'\', \'allowNetworking\', \'internal\', \'allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/flvplayer.swf\', \'flashvars\', \'file='.rawurlencode($swf_url).'\', \'quality\', \'high\', \'wmode\', \'transparent\', \'allowfullscreen\', \'true\');</script>';</span> $html = '<span id="'.$randomid.'"></span><script type="text/javascript" reload="1">$(\''.$randomid.'\'). innerHTML=AC_FL_RunContent(\'width\', \''.$width.'\', \'height\', \''.$height.'\', \'allowNetworking\', \'internal\', \'allowScriptAccess\', \'never\', \'src\', \''.STATICURL.'image/common/flvplayer.swf\', \'flashvars\', \'file='.rawurlencode($ swf_url).'\', \'quality\', \'high\', \'wmode\', \'transparent\', \'allowfullscreen\', \'true\');</script>';</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$html = '<video id="'.$randomid.'" controls preload width="'.$width.'" height="'.$height.'" src="'.$swf_url.'" ></video><script type="text/javascript">jqm("#'.$randomid.'").mediaelementplayer();</script>';</span> $html = '<video id="'.$randomid.'" controls preload width="'.$width.'" height="'.$height.'" src="'.$swf_url.'" >< /video><script type="text/javascript">jqm("#'.$randomid.'").mediaelementplayer();</script>';</span>
c）替換分享中的視頻播放器
需要改動的代碼在文件source/include/spacecp/spacecp_share.php 裡，將下面這句
 |  |
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">'flv' => $_G['style']['imgdir'].'/flvplayer.swf?&autostart=true&file='.urlencode($link),</span> 'flv' => $_G['style']['imgdir'].'/flvplayer.swf?&autostart=true&file='.urlencode($link),</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">'flv' => $link,</span> 'flv' => $link,</span>
再在文件static/js/home.js 裡，將函數showFlash 中的下面這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var videoFlash = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="480" height="450">' + '<param value="transparent" name="wmode"/>' + '<param value="FLASHADDR" name="movie" />' + '<param name="allowScriptAccess" value="never" />' + '<param name="allowNetworking" value="none" />' + '<embed src="FLASHADDR" wmode="transparent" allowfullscreen="true" type="application/x-shockwave-flash" width="480" height="450" allowScriptAccess="never" allowNetworking="internal"></embed>' + '</object>';</span> var videoFlash = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="480" height="450">' + '<param value="transparent" name="wmode"/>' + '<param value="FLASHADDR" name="movie" />' + '<param name="allowScriptAccess" value="never" />' + '<param name="allowNetworking" value="none" /> ' + '<embed src="FLASHADDR" wmode="transparent" allowfullscreen="true" type="application/x-shockwave-flash" width="480" height="450" allowScriptAccess="never" allowNetworking="internal "></embed>' + '</object>';</span>
後加上
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var videoHtml5 = '<video id="videoplayer_SHAREID" controls preload autoplay width="480" height="450" src="' + flashvar + '" ></video><script type="text/javascript">jqm("#videoplayer_SHAREID").mediaelementplayer();</script>';</span> var videoHtml5 = '<video id="videoplayer_SHAREID" controls preload autoplay width="480" height="450" src="' + flashvar + '" ></video><script type="text/javascript">jqm( "#videoplayer_SHAREID").mediaelementplayer();</script>';</span>
再在同一個函數里稍後的這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">flashvar = encodeURI(flashvar);</span> flashvar = encodeURI(flashvar);</span>
前加上
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var flvReg = new RegExp('.flv$', 'ig'); if (flvReg.test(flashvar)) { flashHtml = videoHtml5; }</span> var flvReg = new RegExp('.flv$', 'ig'); if (flvReg.test(flashvar)) { flashHtml = videoHtml5; }</span>
上面的修改僅涉及原來Discuz的支持flv格式的視頻播放器。但在這基礎上略做改動也能支持當前最流行的視頻格式mp4。
a）論壇首先要改動文件static/js/editor.js 將下面這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">ext = in_array(ext, ['mp3', 'wma', 'ra', 'rm', 'ram', 'mid', 'asx', 'wmv', 'avi', 'mpg', 'mpeg', 'rmvb', 'asf', 'mov', 'flv', 'swf']) ? ext : 'x';</span> ext = in_array(ext, ['mp3', 'wma', 'ra', 'rm', 'ram', 'mid', 'asx', 'wmv', 'avi', 'mpg', 'mpeg' , 'rmvb', 'asf', 'mov', 'flv', 'swf']) ? ext : 'x';</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">ext = in_array(ext, ['mp4', 'mp3', 'wma', 'ra', 'rm', 'ram', 'mid', 'asx', 'wmv', 'avi', 'mpg', 'mpeg', 'rmvb', 'asf', 'mov', 'flv', 'swf']) ? ext : 'x';</span> ext = in_array(ext, ['mp4', 'mp3', 'wma', 'ra', 'rm', 'ram', 'mid', 'asx', 'wmv', 'avi', 'mpg' , 'mpeg', 'rmvb', 'asf', 'mov', 'flv', 'swf']) ? ext : 'x';</span>
其次在文件source/function/function_discuzcode.php 裡，將函數parsemedia 中的下面這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">case 'flv':</span> case 'flv':</span>
後加上
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">case 'mp4':</span> case 'mp4':</span>
b）日誌不需額外改動
c）分享在文件source/include/spacecp/spacecp_share.php 裡，將下面這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">if(empty($flashvar) && preg_match("/\.flv$/i", $link)) {</span> if(empty($flashvar) && preg_match("/\.flv$/i", $link)) {</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">if(empty($flashvar) && preg_match("/\.(flv|mp4)$/i", $link)) {</span> if(empty($flashvar) && preg_match("/\.(flv|mp4)$/i", $link)) {</span>
再在文件static/js/home.js 裡，將函數showFlash 中的下面這句
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var flvReg = new RegExp('.flv$', 'ig');</span> var flvReg = new RegExp('.flv$', 'ig');</span>
改成
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">var flvReg = new RegExp('.(flv|mp4)$', 'ig');</span> var flvReg = new RegExp('.(flv|mp4)$', 'ig');</span>
３。 替換個人空間裡的音樂盒 <br>在前文（ 鏈接 ）中我們討論過基於mejs的音樂盒插件，它能夠即插即用，不影響網站裡的其它功能。 不管是用插件還是修改代碼，為了有統一的風格，整個網站最好還是用同一個播放器。
下面我們討論通過修改代碼來使用基於mejs的音樂盒。 除了用mejs外，還有用到一個mejs插件mep-feature-playlist-master 和一個jQuery插件m-custom-scrollbar。 首先將前面對template/default/common/header_common.htm 的修改再改為
| 舊播放器 | 新播放器 |
|---|---|
 |  |
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left"><script type="text/javascript" src="{$_G[setting][jspath]}jquery.min.js"></script> <script type="text/javascript" src="{$_G[setting][jspath]}mediaelement/mediaelement-and-player.min.js"></script> <script type="text/javascript" src="{$_G[setting][jspath]}mep-feature-playlist-master/mep-feature-playlist.js"></script> <script type="text/javascript" src="{$_G[setting][jspath]}m-custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script> <link rel="stylesheet" href="{$_G[setting][jspath]}mediaelement/mediaelementplayer.min.css" /> <link href="{$_G[setting][jspath]}mep-feature-playlist-master/mep-feature-playlist.css" rel="stylesheet" /> <link href="{$_G[setting][jspath]}m-custom-scrollbar/jquery.mCustomScrollbar.css" rel="stylesheet" /> <script type="text/javascript"> var jqm = jQuery.noConflict(true); </script></span> <script type="text/javascript" src="{$_G[setting][jspath]}jquery.min.js"></script> <script type="text/javascript" src="{$_G[setting ][jspath]}mediaelement/mediaelement-and-player.min.js"></script> <script type="text/javascript" src="{$_G[setting][jspath]}mep-feature-playlist- master/mep-feature-playlist.js"></script> <script type="text/javascript" src="{$_G[setting][jspath]}m-custom-scrollbar/jquery.mCustomScrollbar.concat.min .js"></script> <link rel="stylesheet" href="{$_G[setting][jspath]}mediaelement/mediaelementplayer.min.css" /> <link href="{$_G[setting][ jspath]}mep-feature-playlist-master/mep-feature-playlist.css" rel="stylesheet" /> <link href="{$_G[setting][jspath]}m-custom-scrollbar/jquery.mCustomScrollbar .css" rel="stylesheet" /> <script type="text/javascript"> var jqm = jQuery.noConflict(true); </script></span>
接著要修改的代碼是文件source/function/function_space.php 裡的函數getblockhtml 中的有關music 的部分：
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">$authcode = substr(md5($_G['authkey'].$uid), 6, 16); $view = ($_G['adminid'] == 1 && $_G['setting']['allowquickviewprofile']) ? '&view=admin' : ''; $querystring = urlencode("home.php?mod=space&uid=$uid&do=index&op=getmusiclist&hash=$authcode$view&t=".TIMESTAMP); $swfurl = STATICURL.'image/common/mp3player.swf?config='.$querystring; if(empty($parameters['config']['height']) && $parameters['config']['height'] !== 0) { $parameters['config']['height'] = '200px'; } else { $parameters['config']['height'] .= 'px'; } $html = "<script language=\"javascript\" type=\"text/javascript\">document.write(AC_FL_RunContent('id', 'mp3player', 'name', 'mp3player', 'devicefont', 'false', 'width', '100%', 'height', '".$parameters['config']['height']."', 'src', '$swfurl', 'menu', 'false', 'allowScriptAccess', 'never', 'swLiveConnect', 'true', 'wmode', 'transparent'));</script>";</span> $authcode = substr(md5($_G['authkey'].$uid), 6, 16); $view = ($_G['adminid'] == 1 && $_G['setting']['allowquickviewprofile' ]) ? '&view=admin' : ''; $querystring = urlencode("home.php?mod=space&uid=$uid&do=index&op=getmusiclist&hash=$authcode$view&t=".TIMESTAMP); $swfurl = STATICURL.'image /common/mp3player.swf?config='.$querystring; if(empty($parameters['config']['height']) && $parameters['config']['height'] !== 0) { $parameters['config']['height'] = '200px'; } else { $parameters['config']['height'] .= 'px'; } $html = "<script language=\"javascript \" type=\"text/javascript\">document.write(AC_FL_RunContent('id', 'mp3player', 'name', 'mp3player', 'devicefont', 'false', 'width', '100%' , 'height', '".$parameters['config']['height']."', 'src', '$swfurl', 'menu', 'false', 'allowScriptAccess', 'never', ' swLiveConnect', 'true', 'wmode', 'transparent'));</script>";</span>
將它改為
<span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">if(empty($parameters['config']['height']) && $parameters['config']['height'] !== 0) { $height = 200; } else { $height = $parameters['config']['height']; } $plheight = $height - 28; $shuffle = ($parameters['config']['shuffle'])?'true':'false'; $autoplay = $parameters['config']['autorun']; $showmodbig = ($parameters['config']['showmod']=='big'); $audioHeight = 30; if ($showmodbig) { $audioHeight += 50; $plheight -= 50; } $html = <<<EOF <style> .mejs-layers .mejs-playlist { overflow-x: hidden; overflow-y: auto; } ul.mejs li { width: 100%; font-size: 10px; text-align: left; padding-left: 6px; } .mejs-playlist li:hover { color: white; } .mejs-playlist li.current { color: yellow; font-weight: bold; } .mejs-poster { max-width: 40px; max-height: 40px; margin: 5px; } .mejs-title { position: absolute; left: 50px; top: 0px; margin: 10px; color: white; font-size: 10px; font-weight: bold; width: auto !important; } .ml span { color: white; } .mejs-controls .mejs-volume-button .mejs-volume-slider { h</span> if(empty($parameters['config']['height']) && $parameters['config']['height'] !== 0) { $height = 200; } else { $height = $parameters[ 'config']['height']; } $plheight = $height - 28; $shuffle = ($parameters['config']['shuffle'])?'true':'false'; $autoplay = $parameters ['config']['autorun']; $showmodbig = ($parameters['config']['showmod']=='big'); $audioHeight = 30; if ($showmodbig) { $audioHeight += 50 ; $plheight -= 50; } $html = <<<EOF <style> .mejs-layers .mejs-playlist { overflow-x: hidden; overflow-y: auto; } ul.mejs li { width: 100%; font-size: 10px; text-align: left; padding-left: 6px; } .mejs-playlist li:hover { color: white; } .mejs-playlist li.current { color: yellow; font-weight: bold; } .mejs-poster { max-width: 40px; max-height: 40px; margin: 5px; } .mejs-title { position: absolute; left: 50px; top: 0px; margin: 10px; color: white; font- size: 10px; font-weight: bold; width: auto !important; } .ml span { color: white; } .mejs-controls .mejs-volume-button .mejs-volume-slider { h</span> <span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">eight: 65px; top: -65px; } .mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total { height: 50px; } .mCSB_scrollTools { width: 8px; } .mCSB_inside > .mCSB_container { margin-right: 0; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(0, 156, 229, 0.5); } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: rgba(0, 156, 229, 0.8); } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar { background-color: rgba(0, 156, 229, 1); } .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { margin: 1px 0; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 1; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: darkgray; } .mejs-layers .mejs-playlist { height: {$plheight}px !important; } </span> eight: 65px; top: -65px; } .mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total { height: 50px; } .mCSB_scrollTools { width: 8px; } .mCSB_inside > . mCSB_container { margin-right: 0; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(0, 156, 229, 0.5); } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background -color: rgba(0, 156, 229, 0.8); } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar { background-color: rgba(0, 156, 229, 1); } .mCSB_outside + .mCS- minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { margin: 1px 0; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 1; } . mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: darkgray; } .mejs-layers .mejs-playlist { height: {$plheight}px !important; }</span> <span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">EOF; if ($showmodbig==false) { $html .= <<<EOF .mejs-poster, .mejs-title { left: -9999px; } EOF; } $html .= <<<EOF </style> <audio id="mejs" type="audio/mp3" controls="controls" width="100%" EOF; if ($autoplay == 'true') $html .= ' autoplay="autoplay"'; $html .= '>'; foreach ($parameters['mp3list'] as $mp3) { $html .= '<source src="'.$mp3[mp3url].'" title="'.$mp3[mp3name].'" data-poster="'.$mp3[cdbj].'"></source>'; } $html .= <<<EOF </audio> <script type="text/javascript"> jqm(document).ready(function () { jqm("#music_content > .ml").height({$height}); jqm('#mejs').mediaelementplayer({ loop: true, shuffle: {$shuffle}, playlist: true, audioHeight: {$audioHeight}, audioVolume: "vertical", playlistposition: 'bottom', features: ['playlistfeature', 'prevtrack', 'playpause', 'stop', 'nexttrack', 'current', 'progress', 'duration', 'volume'], keyActions: [] }); if (jqm('#music_content > .ml').width() < 250) { jqm('.mejs-prevtrack-button, .mejs-nexttrack-button').css({ 'display': 'none' }); } /</span> EOF; if ($showmodbig==false) { $html .= <<<EOF .mejs-poster, .mejs-title { left: -9999px; } EOF; } $html .= <<<EOF </style> <audio id="mejs" type="audio/mp3" controls="controls" width="100%" EOF; if ($autoplay == 'true') $html .= ' autoplay="autoplay"'; $ html .= '>'; foreach ($parameters['mp3list'] as $mp3) { $html .= '<source src="'.$mp3[mp3url].'" title="'.$mp3[mp3name ].'" data-poster="'.$mp3[cdbj].'"></source>'; } $html .= <<<EOF </audio> <script type="text/javascript"> jqm (document).ready(function () { jqm("#music_content > .ml").height({$height}); jqm('#mejs').mediaelementplayer({ loop: true, shuffle: {$shuffle} , playlist: true, audioHeight: {$audioHeight}, audioVolume: "vertical", playlistposition: 'bottom', features: ['playlistfeature', 'prevtrack', 'playpause', 'stop', 'nexttrack', 'current' , 'progress', 'duration', 'volume'], keyActions: [] }); if (jqm('#music_content > .ml').width() < 250) { jqm('.mejs-prevtrack-button , .mejs-nexttrack-button').css({ 'display': 'none' }); } /</span> <span class="notranslate" onmouseover="_tipon(this)" onmouseout="_tipoff()"><span class="google-src-text" style="direction: ltr; text-align: left">/ remove a suspicious element that causes the page content to be smaller on iPhone and iPad jqm('.mejs-offscreen').remove(); jqm('.mejs-playlist').mCustomScrollbar({ theme: "minimal" }); }); </script> EOF;</span> / remove a suspicious element that causes the page content to be smaller on iPhone and iPad jqm('.mejs-offscreen').remove(); jqm('.mejs-playlist').mCustomScrollbar({ theme: "minimal" } ); }); </script> EOF;</span>
HF:小說明，初次使用之後確實替換了Discuz原始播放器，但是這邊要注意一件事情會出現一個小錯誤，你會無法找到js相關檔案，這邊需要至後台>全局>性能優化，將js緩存目錄更改至默認目錄 static/js/，這樣就不會出現錯誤了。
出處:彼岸網
作者:天香公主
翻譯及修改部分文句:HF
原網址:點我
留言
張貼留言
留言時請注意句子內容，若有色情、廣告、引戰等都會刪除唷，請遵守網路規範及保持風度^____^
※基本上您問問題，HF都會盡最快速度來回您(基本上24H內)，希望HF的回答及解釋可以替您解決問題。