jPlayer是个用JavaScript写的完全免费和开源的媒体库(media library)。作为jQuery插件的一员，使用jPlayer可以在你的网页上轻松加入跨平台的音乐和视频。通过jPlayer的API，你可以构想出具有创意的影音解决方案，当然，你也可以为jPlayer贡献出自己的一份力。

html5带来了一系列新技术 其中就包括audio media新标签 web音频 视频成为可能
jplayer可以运用html5 flashplayer使你的网站更加生动

浏览器支持
Windows: Firefox, Chrome, Opera, Safari, IE6, IE7, IE8, IE9,IE10,IE11
OSX: Safari, Firefox, Chrome, Opera
iOS: Mobile Safari: iPad, iPhone, iPod Touch
Android: Android 2.3 以上
Blackberry: OS 7 Phone Browser, PlayBook Browser
媒体支持
HTML5: mp3, mp4 (AAC/H.264), ogg (Vorbis/Theora), webm (Vorbis/VP8), wav
Flash: mp3, mp4 (AAC/H.264), rtmp, flv

基础使用
引用
jplayer.blue.monday.css
jquery.min.js
jquery.jplayer.min.js
js
$(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function (event) {
$(this).jPlayer("setMedia", {
m4a:"mp3/David Guetta&Sia-Titanium.mp3",
});
},
swfPath: "js",
supplied: "m4a, oga",
wmode: "window",
smoothPlayBar: true,
keyEnabled: true
});
})
html
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div id="jp_container_1" class="jp-audio">
<div class="jp-type-single">
<div class="jp-gui jp-interface">
<ul class="jp-controls">
<li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
<li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
<li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
<li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
<li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
<li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
</ul>
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
<div class="jp-time-holder">
<div class="jp-current-time"></div>
<div class="jp-duration"></div>
<ul class="jp-toggles">
<li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
<li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
</ul>
</div>
</div>
<div class="jp-title">
<ul>
<li>Cro Magnon Man</li>
</ul>
</div>
<div class="jp-no-solution">
<span>Update Required</span>
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
</div>
</div>
</div>

支持，怎么研究研究搞到wordpress上面用用

jplayer video使用
引用
jplayer.blue.monday.css
jquery.min.js
jquery.jplayer.min.js
js
$(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
m4v: "恶魔高校DxD07.mp4",
});
},
swfPath: "js",
supplied: "webmv, ogv, m4v",
size: {
width: "640px",
height: "360px",
cssClass: "jp-video-360p"
},
smoothPlayBar: true,
keyEnabled: true
});
})
html
<div id="jp_container_1" class="jp-video jp-video-360p">
<div class="jp-type-single">
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div class="jp-gui">
<div class="jp-video-play">
<a href="javascript:;" class="jp-video-play-icon" tabindex="1">play</a>
</div>
<div class="jp-interface">
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-current-time"></div>
<div class="jp-duration"></div>
<div class="jp-controls-holder">
<ul class="jp-controls">
<li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
<li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
<li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
<li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
<li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
<li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
</ul>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
<ul class="jp-toggles">
<li><a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a></li>
<li><a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a></li>
<li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
<li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
</ul>
</div>
<div class="jp-title">
<ul>
<li>Big Buck Bunny Trailer</li>
</ul>
</div>
</div>
</div>
<div class="jp-no-solution">
<span>Update Required</span>
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
</div>
</div>
</div>

楼主，如果一个页面有好几个音乐播放器，点击其中一个其他的也会播放的，这点怎么改啊？

视屏路径有中文,在初始化加载时会出现乱码问题,怎么解决, 谢谢!

顺道顶一下-------这样应该就能凑齐标准的十五字了

怎么让页面启动歌曲就播放呢

楼主，获取当前播放器的播放时间怎么获取啊？

楼主 还在吗？ 发我一份了 谢谢！ 603480902 @qq.com

我想问下 怎么解决火狐浏览器版本低的问题

楼主在吗？

jplayer可以在vue中使用么