关于播放器JPlayer的使用及遇到的问题

jPlayer是一个用于控制和播放mp3文件的jQuery插件。它在后台使用Flash来播放mp3文件,前台播放器外观完全可以使用XHML/CSS自定义。支持:

有一点比较好的是,在支持html5的浏览器上会使用html5的标签audio或者video,而不支持的浏览器上使用swf来播放

选择需要播放的Mp3文件。

播放、暂停、停止控制。
音量控制。 

取得播放进度等信息。

官方网站:http://www.jplayer.org/

支持格式:

  • HTML5: mp3, mp4 (AAC/H.264), ogg (Vorbis/Theora), webm (Vorbis/VP8), wav
  • Flash: mp3, mp4 (AAC/H.264), flv

范例:







Demo : jPlayer as a video player






		
		



大部分都是官网上的demo,需要引入jquery.jplayer.min.js 以及官网上的2个css包,还有Jplayer.swf

目录结构如下,js文件夹中为官网提供的js文件,skin为官网提供的css皮肤包


这里遇到二个奇怪的问题,在本地时测试demo,只能播放官网说的m4v格式,而用flv格式就不行,但放在服务器上就解决了。

另外就是

ready: function () {
			$(this).jPlayer("setMedia", {
				flv: "/workflowLocal/j/1.flv"
			});
		},
这里的setMedia设置文件路径时候,本地只能引用url路径 比如:http://xxxxxxxxxxxxxx,而不能使用绝对或者相对路径

而在服务器上时,则可以使用绝对路径,但一定要是以项目根目录开始的绝对路径才可以。

这二个问题不知道怎么解决。。。

因为项目中要用到切换视频的功能,所以尝试了一下 代码如下 ,点击按钮切换

function a(){
		$("#jquery_jplayer_1").jPlayer("setMedia", {
				flv: "/workflowLocal/j/2.flv"
			});
	}

服务器上播放效果如下:



你可能感兴趣的:(关于播放器JPlayer的使用及遇到的问题)