我正在使用 https://developer.vimeo.com/player/js-api 中提供的示例:
Javascript + HTML:
脚本.js:
$(function() {
var iframe = $('#player1')[0];
var player = $f(iframe);
var status = $('.status');
// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
status.text('ready');
player.addEvent('pause', onPause);
player.addEvent('finish', onFinish);
player.addEvent('playProgress', onPlayProgress);
});
// Call the API when a button is pressed
$('button').bind('click', function() {
player.api($(this).text().toLowerCase());
});
function onPause(id) {
status.text('paused');
}
function onFinish(id) {
status.text('finished');
}
function onPlayProgress(data, id) {
status.text(data.seconds + 's played');
}
});
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
<div>
<button>Play</button>
<button>Pause</button>
<p>Status: <span class="status">…</span></p>
</div>
<script src="script.js"></script>
我希望能够在稍后的某个时间向事件添加说明。 比如说,我想将警报('123')添加到'暂停'事件:
oldPauseEvent = player.get('pause'); //I made it up obviously..
player.addEvent('pause',newPuase);
function newPause(id){
// do old stuff of 'pause' event. Namely onPause()
oldPauseEvent();
// do new added stuff
alert('123');
}
我似乎无法找到事件在 player
中的存储位置或方式。我在 Viemo 网站的 API 文档中找不到任何有用的内容。
非常感谢任何帮助!
最佳答案
向暂停按钮添加 ID。 Froogaloop api 方法 getDuration() 作为警报返回。
有用的链接:
Return duration from a function
Further explanation of callback method
Method: seekTo, which does not have a return value
$(function() {
var iframe = $('#player1')[0];
var player = $f(iframe);
var status = $('.status');
// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
status.text('ready');
player.addEvent('pause', onPause);
player.addEvent('finish', onFinish);
player.addEvent('playProgress', onPlayProgress);
});
// Call the API when a button is pressed
$('button').bind('click', function() {
player.api($(this).text().toLowerCase());
});
// On pause button click, call getDuration().
// Get Returned duration via _callback and alert it
$('#pauseID').bind('click', function() {
getDuration(function(duration) {
alert('Video Duration: ' + duration);
});
});
// Call the API when the pause button is pressed.
// getDuration() is a froogaloop api method that has a return value.
function getDuration(_callback) {
player.api('getDuration', function(dur) {
_callback(dur);
});
}
function onPause(id) {
status.text('paused');
}
function onFinish(id) {
status.text('finished');
}
function onPlayProgress(data, id) {
status.text(data.seconds + 's played');
}
});
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
<div>
<button>Play</button>
<button id='pauseID'>Pause</button>
<p>Status: <span class="status">…</span></p>
</div>
关于javascript - Froogaloop 获取事件函数的引用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33498069/