最近在搞前端頁面。其中嵌入視訊播放器需要相容ie8（ie真是一坨屎），網上找了兩個方案。

第一個h5的video.js方式，網上搞得例子ie8是可以的，但是那些js啊css啊一弄到自己的頁面之後ie8就不行了，什麼東西也沒少，很奇怪，除錯報錯是js 6709 行 11列缺少大括號，我加上之後也是然並卵。網上還有一種國內高手優化過的js，試了還是不行。不知道坑在哪，無奈放棄了。

換了第二種方式，jplayer，我照搬官網的例子，這個官網的例子乾脆ie8也不好使，我就很納悶，最後在網上看到很可能是swfpath的問題，於是我就把那個swf檔案拿到頁面目錄同級，然後swfpath：“./”這下果斷好了

都是網上和官網的例子，為了照顧像我這樣的懶人，還是貼上程式碼吧，那些js什麼的都是jplayer裡面的，百度一下你就知道。

<link href="jPlayer/skin/blue.monday/jplayer.blue.monday.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jPlayer/lib/jquery.min.js"></script>
<script type="text/javascript" src="jPlayer/dist/jplayer/jquery.jplayer.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){


$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
title: "",
m4v: "./video/3.mp4",
poster:"./img/video3.jpg"
});
},
play: function() { // To avoid multiple jPlayers playing together.
$(this).jPlayer("pauseOthers");
},
swfPath: "./",
supplied: "webmv, ogv, m4v",
globalVolume: true,
useStateClassSkin: true,
autoBlur: false,
smoothPlayBar: true,
keyEnabled: true
});


$("#jquery_jplayer_2").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
title: "",
m4v: "./video/4.mp4",
poster:"./img/video4.jpg"
});
},
play: function() { // To avoid multiple jPlayers playing together.
$(this).jPlayer("pauseOthers");
},
swfPath: "./",
supplied: "webmv, ogv, m4v",
globalVolume: true,
useStateClassSkin: true,
cssSelectorAncestor: "#jp_container_2",
autoBlur: false,
smoothPlayBar: true,
keyEnabled: true
});


});
</script>
 

<div  style="margin-top:50px;width:80%;text-align:center;background-color:#F9E8F0;position:relative;left:10%;">
<div id="jp_container_1" style="margin:0 auto" class="jp-video jp-video-270p" role="application" aria-label="media player">
<div class="jp-type-single">
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div class="jp-gui jp-interface">
<div class="jp-controls"><!--播放暫停按鈕-->
<button class="jp-play" role="button" tabindex="0">play</button>
</div>
<div class="jp-progress"><!--進度條-->
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>       
</div>
</div>
</div>
<div id="jp_container_2" style="margin:20px auto" class="jp-video jp-video-270p" role="application" aria-label="media player">
<div class="jp-type-single">
<div id="jquery_jplayer_2" class="jp-jplayer"></div>
<div class="jp-gui jp-interface">
<div class="jp-controls"><!--播放暫停按鈕-->
<button class="jp-play" role="button" tabindex="0">play</button>
</div>
<div class="jp-progress"><!--進度條-->
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>       
</div>
</div>
</div>
</div>