Javascript 在拖动滑块时,我可以在HTML5范围输入上监听什么事件以连续触发函数?
在拖动滑块时,我可以在HTML5范围输入上监听什么事件,以连续触发函数 我正在为HTML5视频播放器开发一个自定义搜索条滑块。我希望在拖动搜索栏时更新这两个值(时间流逝和剩余时间,随着视频播放,这两个值每秒钟都会更新),以便用户可以精确地看到搜索时间(我知道上次是52分钟,所以我拖动搜索栏直到时间读数为52) 我尝试了此代码,但每次拖动滑块时只触发一次:Javascript 在拖动滑块时,我可以在HTML5范围输入上监听什么事件以连续触发函数?,javascript,jquery,html,Javascript,Jquery,Html,在拖动滑块时,我可以在HTML5范围输入上监听什么事件,以连续触发函数 我正在为HTML5视频播放器开发一个自定义搜索条滑块。我希望在拖动搜索栏时更新这两个值(时间流逝和剩余时间,随着视频播放,这两个值每秒钟都会更新),以便用户可以精确地看到搜索时间(我知道上次是52分钟,所以我拖动搜索栏直到时间读数为52) 我尝试了此代码,但每次拖动滑块时只触发一次: var video = $("#fullscreen"); var videoInfo = video.get(0); var seekBa
var video = $("#fullscreen");
var videoInfo = video.get(0);
var seekBar = $("#seek-bar");
// convert number to double-digit (or greater) values (09, 99, 999)
function digitize(n) {
return n > 9 ? "" + n : "0" + n;
}
// Convert seconds to hh:mm:ss
function secondsToString(intime) {
var numseconds = digitize(Math.floor(intime % 60));
intime = Math.floor(intime / 60);
var numminutes = digitize(intime % 60);
intime = Math.floor(intime / 60);
var numhours = digitize(intime);
return numhours + ":" + numminutes + ":" + numseconds;
}
// While bar is being dragged, update times
seekBar.on('change', function() {
// Calculate the slider value
console.log("Seeking at: " + seekBar[0].value);
var progressHMS = secondsToString(videoInfo.currentTime);
var remainingHMS = "-" + secondsToString(videoInfo.duration -
videoInfo.currentTime);
timeProgress.html(progressHMS);
timeRemaining.html(remainingHMS);
});
当然,酒吧:
<div class="control-section">
<div id="video-time-progress">
00:00:00
</div>
<input type="range" id="seek-bar" value="0" min="0" max="1" step="0.001">
<div id="video-time-remaining">
00:00:00
</div>
</div>
00:00:00
00:00:00
我在想,也许每次滑块到达一个新的
步骤时我都能检测到(在本例中是长度的1/1000),但我似乎找不到由步骤触发的事件,因为change
没有这样做。您可以收听输入或mousemove
事件。