jPlayer使用手记
前几日开发一个音乐电台用到了jPlayer，见网络上资料很少，官方英文资料太坑爹TAT，于是就写一个手记给大家参考下.
据我观察，jPlayer的原理主要是用到HTML5，在不支持HTML5的浏览器上使用SWF。做到全兼容，这一点很不错。
官方还说明，服务器对于MP3文件不要做GZIP压缩，只是徒增CPU而已。并且在Flash播放GZIP的MP3时会出错。
jPlayer需要两个文件上传到你的服务器。
jquery.jplayer.min.js
Jplayer.swf
最重要的当然还是jquery.min.js.
jPlayer构造
jPlayer构造在jQuery选择器上。采用 $(ID).jPlayer(Object: options) 的形式执行动作。
在某些场合，jPlayer也可以构造在body上，指你不用播放视频的时候。
注意：swfPath，它定义jPlayer SWF文件的路径。记得把SWF文件上传到你的服务器！
你也可以使用类似jPlayer({solution:"flash, html")的语句规定用什么方式播放媒体优先。
初始化后更改设置
实现一个自动播放音乐的网页
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function (event) {
$(this).jPlayer("setMedia", {
m4a:"http://www.jplayer.org/audio/m4a/TSP-01-Cro_magnon_man.m4a",
oga:"http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
});
},
swfPath: "js",
supplied: "m4a, oga",
}).jPlayer("play");
});
解释一下上面的代码：
第一行“$(document).ready(function(){”大家都无比亲切吧，文档载入事件。
第二行“$("#jquery_jplayer_1").jPlayer({”选择的是一个DIV，用于承载HTML5元素或是Flash，大家在文档里写一个空的DIV即可。
第三行“ready: function (event) {”，ready是一个键，function是一个值，灰常熟悉的东西。
第四行“$(this).jPlayer("setMedia", {”this指的是“$("#jquery_jplayer_1")”，意为：“$("#jquery_jplayer_1").jPlayer("setMedia", {”
很熟悉。
setMedia是一个option，根据第二步说的。
第九行“swfPath: "js",”，这个定义了swf播放器所在的相对路径，如果你不打算兼容不支持HTML5的网页，可以不写:）
第十行“supplied: "m4a, oga",”所支持的格式。
第十一行“jPlayer("play");”意为：$("#jquery_jplayer_1").jPlayer("play");，播放媒体，实现自动播放。
jPlayer方法
$(id).jPlayer( "setMedia", Object: media ) : jQuery
描述：这个方法被用来定义要播放的媒体， 媒体参数是一个对象，具有属性定义不同的编码格式。
所有的编码格式都应该在构造设置中指定“jPlayer({ supplied : "f1, f2, fN"})”。
jPlayer构造选项jPlayer({ preload )是用来指定何时开始下载媒体。
参数：媒体
对象，定义媒体的格式以及网址。
支持格式：
MP3MP3音频格式M4AMP4音频格式M4VMP4视频格式webma的WebM音频格式webmvWebM视频格式ogaOGG音频格式OGVOGG视频格式FLAFLV音频格式FLVFLV视频格式WAVwav音频格式
示例代码：
$("#jpId").jPlayer( {
ready: function() {
$(this).jPlayer( "setMedia", {
m4a: "m4a/elvis.m4a",
oga: "oga/elvis.oga",
webma: "webm/elvis.webm"
});
},
supplied: "webma, m4a, oga"
);
$(id).jPlayer( "clearMedia") : jQuery
描述：这个方法用来清空媒体并且停止播放音乐。如果媒体正在下载，则取消。在其设置完毕以后，如果在jPlayer("setMedia")之前使用.jPlayer("play")，将会产生错误事件。
参数：这个方法没有参数。
示例代码：
$("#jpId").jPlayer("clearMedia");
$(id).jPlayer( "load") : jQuery
描述：这个方法用来在jPlayer("setMedia");之后载入音乐。当然，如果你使用预载（{preload:"auto"}），这个方法有没有一样。
参数：这个方法没有参数。
示例代码：
$("#jpId").jPlayer("load");$(id).jPlayer( "play", [Number: time] ) : jQuery
描述：这个方法在jPlayer("setMedia")之前使用，如果没有time参数，新的媒体该方法会从头播放，打开的媒体会从jPlayer("pause")处开始播放。
参数：time(可选)，用秒来定义播放位置。
示例代码：
$("#jpId").jPlayer( { ready: function() { // $.jPlayer.event.ready 事件 $(this).jPlayer("setMedia", { // 设置媒体 m4v: "m4v/presentation.m4v" }).jPlayer("play"); // 自动播放媒体 }, ended: function() { // The $.jPlayer.event.ended 事件 $(this).jPlayer("play"); //重复播放媒体 }, supplied: "m4v" ); $("#jumpToTime").click( function() { $("#jpId").jPlayer("play", 42); // 从媒体的42秒处开始播放. });官方英文参考手册：http://www.jplayer.org/latest/developer-guide/