Vimeo CallBack 功能 - 视频结束时单击按钮
Vimeo CallBack function - Click the button when the video ends
我有一堆正在制作的视频。目前,用户必须单击 "button" 以确保他们已观看视频,然后才能继续观看下一个视频。我想更改此功能,以便每当用户观看视频时,"button" 会自动点击并上传下一个视频。为了保存用户数据,点击按钮很重要。
现在这是我实现的(测试代码):
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>
<button type="button" onclick= "showMsg();">Click Me!</button>
<script>
function showMsg(){
alert('you clicked');
}
</script>
<script>
var $ = jQuery.noConflict();
$(function() {
var iframe = $('#player1')[0];
player = $f(iframe);
player.addEvent('ready', function() {
player.addEvent('finish', onFinish);
});
$('button').bind('click', function() {
player.api($(this).onFinish());
});
function onFinish() {
alert('finished');
}
});
使用这个,无论何时视频结束,它都不会给出任何响应。有什么我遗漏或做错了什么吗?
根据他们的文档 here,您应该在嵌入 url api=1&player_id=player1[=18 上添加更多参数=] 启用 API 并指示 playerId
<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0&api=1&player_id=player1" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>
<button type="button" onclick= "showMsg();">Click Me!</button>
<script>
function showMsg(){
alert('you clicked');
}
$(function() {
var iframe = $('#player1')[0];
player = $f(iframe);
player.addEvent('ready', function() {
player.addEvent('finish', onFinish);
});
function onFinish(id) {
alert('finished');
}
});
</script>
我有一堆正在制作的视频。目前,用户必须单击 "button" 以确保他们已观看视频,然后才能继续观看下一个视频。我想更改此功能,以便每当用户观看视频时,"button" 会自动点击并上传下一个视频。为了保存用户数据,点击按钮很重要。
现在这是我实现的(测试代码):
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>
<button type="button" onclick= "showMsg();">Click Me!</button>
<script>
function showMsg(){
alert('you clicked');
}
</script>
<script>
var $ = jQuery.noConflict();
$(function() {
var iframe = $('#player1')[0];
player = $f(iframe);
player.addEvent('ready', function() {
player.addEvent('finish', onFinish);
});
$('button').bind('click', function() {
player.api($(this).onFinish());
});
function onFinish() {
alert('finished');
}
});
使用这个,无论何时视频结束,它都不会给出任何响应。有什么我遗漏或做错了什么吗?
根据他们的文档 here,您应该在嵌入 url api=1&player_id=player1[=18 上添加更多参数=] 启用 API 并指示 playerId
<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0&api=1&player_id=player1" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>
<button type="button" onclick= "showMsg();">Click Me!</button>
<script>
function showMsg(){
alert('you clicked');
}
$(function() {
var iframe = $('#player1')[0];
player = $f(iframe);
player.addEvent('ready', function() {
player.addEvent('finish', onFinish);
});
function onFinish(id) {
alert('finished');
}
});
</script>