我正在创建一系列视频教程,并希望防止用户向前搜索和跳过部分。我将使用用于桌面和 iPad 浏览器的 HTML5 视频播放器。理想情况下,我希望它也能在 iPhone 上运行,但我意识到你无法控制手机上的视频,因为它使用 iPhone 视频播放器。
如何防止用户在 HTML5 视频播放器上搜索?
我正在创建一系列视频教程,并希望防止用户向前搜索和跳过部分。我将使用用于桌面和 iPad 浏览器的 HTML5 视频播放器。理想情况下,我希望它也能在 iPhone 上运行,但我意识到你无法控制手机上的视频,因为它使用 iPhone 视频播放器。
如何防止用户在 HTML5 视频播放器上搜索?
Video.js 的另一个示例:
videojs('example_video_1').ready(function(){
var player = this;
var previousTime = 0;
var currentTime = 0;
var seekStart = null;
player.on('timeupdate', function(){
previousTime = currentTime;
currentTime = player.currentTime();
});
player.on('seeking', function(){
if(seekStart === null) {
seekStart = previousTime;
}
});
player.on('seeked', function() {
if(currentTime > seekStart) {
player.currentTime(seekStart);
}
seekStart = null;
});
});
I only wanted to prevent seeking forward. I have more code in my system that allows them to pause and come back later. It records the current position and sets the video position on load.
I'm using video.js. I tried to use the timechange event, but it fires before seeking. So, I resorted to using an interval to grab the current position every second. If the seeking position is greater than the current position, then set it back. Works great.
var player = null;
var curpos = 0;
videojs('player').ready(function(){
player = this;
});
player.on('seeking', function () {
var ct = player.currentTime();
if(ct > curpos) {
player.currentTime(curpos);
}
});
function getpos() {
curpos = player.currentTime();
}
onesecond = setInterval(getpos, 1000);
感谢您的回答瑞克。
我注意到用户可以拖动并按住允许他们继续的搜索器,所以我在 getPos 函数中添加了不搜索的地方。HTML 5 和 jQuery。
var video = document.getElementsByTagName('video')[0];
function allowMove() {
$('input[id$="btnNext"]').removeAttr('disabled');
$('input[id$="videoFlag"]').val("1");
}
function getpos() {
if (!(video.seeking)) {
curpos = video.currentTime;
}
console.log(curpos)
}
onesecond = setInterval('getpos()', 1000);
function setPos() {
var ct = video.currentTime;
if (ct > curpos) {
video.currentTime = curpos;
}
}
如果你真的想做这个令人惊讶的用户敌对的事情,那么你可以使用controls属性。您必须使用 JS 实现您希望允许的任何控件。
当然,用户总是可以直接查看 > 来源来获取视频的 URI 并下载它。
为什么不这样呢?
var video = document.getElementById("myVideo");
var counter = 0;
video.on('timeupdate', function() {
if (video[0].paused == false) {
counter = video[0].currentTime;
}
}
video.on('seeking', function(e) {
if ( parseInt(counter, 10) != parseInt(video[0].currentTime, 10) ) {
video[0].currentTime = counter;
}
});
我同意@Bart Kiers 的观点,认为这不是一个好主意,但如果你必须这样做,我可以想到一种方法:隐藏控件并提供你自己的播放按钮,使用 JavaScript 开始视频。