对于一个成功的产品,它是对外封闭的,但又是对外开放的,这句话并不矛盾,让我来说一下,说它对外封闭是因为它本身的代码不允许你去修改,而说它开放,是因为它为我们定义了很多API,或者叫回调方法,对于jwplayer来说,它为我们提供了很多js的回调方法(事件),它被包含在events属性上的.

应用场合

播放时记录当前视频的时间,播放完成时写入完成的时间,像这些功能,我们都可以通过事件回调的方法解决,即为events属性赋相应的值.

注意

测试时,jwplayer需要在正式网站上测试,而本地打开时,它的events属性是不启作用的

events 实例

 var player = jwplayer("mediaplayer").setup({
flashplayer: "player.swf",
file: 'http://localhost/222.mp4',
autostart: "true",
bufferlength: '20',
width: '400',
height: '400',
image: '111.jpg',
events: {
onComplete: function () { console.log("播放结束!!!"); },
onVolume: function () { console.log("声音大小改变!!!"); },
onReady: function () { console.log("准备就绪!!!"); },
onPlay: function () { console.log("开始播放!!!"); },
onPause: function () { console.log("暂停!!!"); },
onBufferChange: function () { console.log("缓冲改变!!!"); },
onBufferFull: function () { console.log("视频缓冲完成!!!"); },
onError: function (obj) { console.log("播放器出错!!!" + obj.message); },
onFullscreen: function (obj) { if (obj.fullscreen) { console.log("全屏"); } else { console.log("非全屏"); } },
onMute: function (obj) { console.log("静音/取消静音") }
}
});

其它回调方法

 player.onBufferChange(function () { alert("缓冲改变!!!"); });
player.onBufferFull(function () { alert("视频缓冲完成!!!"); });
player.onError(function (obj) { alert("播放器出错!!!" + obj.message); })
player.onFullscreen(function (obj) {
if (obj.fullscreen) { alert("全屏"); }
else { alert("非全屏"); }
});
player.onMute(function (obj) { }) // obj. mute是否静音
player.onPlaylist(function (obj) { //视频列表载入完成
alert(obj.playlist[0]['file']);
});
var callback = function () { alert("callback");};//定义一个回调方法
player.onPlaylistItem(callback) // 开始播放一个视频时触发obj.index为视频索引
player.onReady(callback) //准备就绪
player.onResize(callback) //obj.width obj.height 宽高
//进入播放时触发obj.oldstate 值:从BUFFERING PAUSE状态进入播放状态
player.onPlay(callback)
//进入暂停obj.oldstate 值1:从PLAYING BUFFERING状态进入暂停
player.onPause(callback)
player.onBuffer(callback) //进入加载obj.oldstate 值PLAYING, PAUSED or IDLE
player.onIdle(callback) //进入空闲obj.oldstate 值PLAYING, PAUSED or BUFFERING.
player.onComplete(callback) //结束播放
player.onVolume(callback) //obj.volume
player.onPlay(function () {
console.log(this.getPosition());
});

技巧

我们看到上面的player是它当前的jwplayer对象,有了这个对象,我们就可以在程序的其它位置调用jwplayer的相关回调方法了,如果你没有定义player对象,也可以通过索引

的方式去访问jwplayer实例,如jwplayer(0)表示第一个jwplayer对象.

相关截图

aaarticlea/png;base64,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" alt="" />

JS~jwPlayer为js预留的回调方法大总结的更多相关文章

  1. jwPlayer为js预留的回调方法

    参考地址:http://www.cnblogs.com/lori/archive/2014/05/05/3709459.html 应用场合 播放时记录当前视频的时间,播放完成时写入完成的时间,像这些功 ...

  2. 常用js,css文件统一加载方法,并在加载之后调用回调函数

    原创内容,转载请注明出处! 为了方便资源管理和提升工作效率,常用的js和css文件的加载应该放在一个统一文件里面完成,也方便后续的资源维护.所以我用js写了以下方法,存放在“sourceControl ...

  3. 【转】第5篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:自动注册JS脚本+委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-19 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第5篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  4. 【转】第4篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-18 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第4篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  5. 关于js回调方法 js递归时使用方法

    js中递归调用本身可以这样: function a1(n){ a1(n)}但是如果需要在参数n进行自增的情况下判断会出错: function a1(n){ if(n>10) return 'aa ...

  6. js静态方法与实例方法定义,js回调方法定义

    主要为了回调方法,随便把静态言法和实例方法也回顾一下. <script type="text/javascript"> var fun = { //下面是静态方法(第一 ...

  7. js实现动态加载脚本的方法实例汇总

      本文实例讲述了js实现动态加载脚本的方法.分享给大家供大家参考,具体如下: 最近公司的前端地图产品需要做一下模块划分,希望用户用到哪一块的功能再加载哪一块的模块,这样可以提高用户体验. 所以到处查 ...

  8. JS 动态加载脚本 执行回调

    JS 动态加载脚本  执行回调 关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件 ...

  9. 基于原生JS封装数组原型上的sort方法

    基于原生JS封装数组原型上的sort方法 最近学习了数组的原型上内置方法的封装,加强了用原生JS封装方法的能力,也进一步理解数组方法封装的过程,实现的功能.虽然没有深入底层,了解源码.以下解法都是基于 ...

随机推荐

  1. Linux下安装python-2.7 先zlib

    2018-04-25 发布 Linux下安装python-2.7  python 1.1k 次阅读  ·  读完需要 25 分钟 1 安装依赖的库 yum -y install python-deve ...

  2. 实例讲解启动mysql server失败的解决方法

    MySQL 实例讲解启动mysql server失败的解决方法 来源: 作者: 发表于: 启动mysql server 失败,查看/var/log/mysqld.err 080329 16:01:29 ...

  3. JPA映射持久化对象(Entity)

    推荐阅读:JPA criteria 查询:类型安全与面向对象 来源: http://blog.sina.com.cn/s/blog_49fd52cf0100rzjn.html 一个普通的POJO类通过 ...

  4. [Luogu 1197] JSOI2008 星球大战

    [Luogu 1197] JSOI2008 星球大战 我算是真的沦为联赛选手了. 并查集裸题. 比较麻烦的是删点. 但是从后往前加点就好操作很多. 所以考虑离线,先存图,然后没被删的点之间,有边就合并 ...

  5. MongoDB - MongoDB CRUD Operations, Query Documents, Query for Null or Missing Fields

    Different query operators in MongoDB treat null values differently. The examples on this page use th ...

  6. Java生成验证码简记

    验证码定义 验证码(captcha):是一种区分用户是计算机还是人的公共全自动程序. 作用:可以防止恶意破解密码.刷票.灌水,有效防止对某一个特定注册用户用特定程序进行暴力破解的登录尝试. 验证码交互 ...

  7. Broken Necklace

    Description 你有一条由N个红色的,白色的,或蓝色的珠子组成的项链(3<=N<=350),珠子是随意安排的. 这里是 n=29 的二个 例子: 1 2 1 2 r b b r b ...

  8. VueJS 获取并编译远程模板 解决方案(简单版)

    原文链接:https://savokiss.com/tech/vuejs-remote-template.html see: forum

  9. 转:修改shape的文字

    Sub 修改shape的文字()'' 修改shape的文字 宏' '    ActiveSheet.Shapes.Range(Array("Flowchart: Connector 193& ...

  10. 苹果笔记本MacBookPro 的新手使用技巧

    Mac 系统的桌面 Mac 的桌面是一个很炫的3D, 背景是一张“星空”图 Dock:  在桌面的下方,有一排图标, 这个叫Dock, 用来快速启动程序, 进入文件夹, 它同时还可以停靠正在运行的程序 ...