对于一个成功的产品,它是对外封闭的,但又是对外开放的,这句话并不矛盾,让我来说一下,说它对外封闭是因为它本身的代码不允许你去修改,而说它开放,是因为它为我们定义了很多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. (一)SVM原理

    前言 本文开始主要介绍一下SVM的分类原理以及SVM的数学导出和SVM在Python上的实现.借鉴了许多文章,会在后面一一指出,如果有什么不对的希望能指正. 一. SVM简介 首先看到SVM是在斯坦福 ...

  2. C++实现成绩管理模拟系统

    C++实现基本的成绩管理系统 需求: 1-学生姓名等基本字段 2-学生成绩字段 3-实现成绩修改和基本统计输出 #include<iostream> #include<windows ...

  3. ACM-ICPC2018 沈阳赛区网络预赛-D-Made In Heaven8

    A*算法: A*,启发式搜索,是一种较为有效的搜索方法. 我们在搜索的时候,很多时候在当前状态,已经不是最优解了,但是我们却继续求解:这个就是暴力搜索浪费时间的原因. 我们在有些时候,往往可以根据一些 ...

  4. UVA 11982 Fantasy Cricket

    https://vjudge.net/problem/UVA-11982 题意: 给出一个包含’U’, ‘D’, ‘E’的字符串, ’U’ 表示需要把这个字符向后移动, ’D’表示需要把这个字符向前移 ...

  5. uva 1639 Candy (对数处理精度)

    https://vjudge.net/problem/UVA-1639 有两个盒子各有n(n≤2*10 5 )个糖,每天随机选一个(概率分别为p,1-p),然后吃一颗糖. 直到有一天,打开盒子一看,没 ...

  6. Codeforces 221 B. Little Elephant and Numbers

    B. Little Elephant and Numbers time limit per test 2 seconds memory limit per test 256 megabytes inp ...

  7. Codeforces 803E - Roma and Poker

    http://codeforces.com/problemset/problem/803/E E. Roma and Poker  time limit per test           2 se ...

  8. codeblocks快捷键(转)

    ==日常编辑== • 按住Ctrl滚滚轮,代码的字体会随你心意变大变小.• 在编辑区按住右键可拖动代码,省去拉(尤其是横向)滚动条之麻烦:相关设置:Mouse Drag Scrolling.• Ctr ...

  9. k8s+docker学习连接汇总

    http://guide.daocloud.io/dcs/docker-9153982.html http://www.dczou.com/viemall/802.html https://wangl ...

  10. 2D旋转和3D旋转

    2D旋转 先给个容器 <p onClick="rotate2D()" id="rotate2D" class="animated_div&quo ...