如何更改视频标签的转发时间

Question

我的网站上有视频标签，当我单击右箭头时，它会转发大约 1 分钟，我想将此时间减少到 10 秒。

<video src="SOURCE" controls="true" id="video" style="height: 477px; width: 980px"></video>

Answer 1

您可以将事件监听器直接附加到视频而不是站点。&nbsp;&nbsp;&nbsp; var video = document.getElementById("video");&nbsp; var timer = 10;&nbsp; video.addEventListener('keydown', (e) => {&nbsp; &nbsp;event.preventDefault();&nbsp; &nbsp;switch (event.keyCode) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;case 37:&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var currentTime = video.currentTime;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; video.currentTime = currentTime - timer;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; break;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;case 39:&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;var currentTime = video.currentTime;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; video.currentTime = currentTime + timer;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; break;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }});&nbsp;<video controls="true" id="video" style="height: 477px; width: 480px">&nbsp; &nbsp;<source src="https://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4">&nbsp;</video>

Answer 2

您可以在此箭头键上附加一个事件处理程序，然后更改 currentTime 属性。但要防止之前的默认行为。const $video = document.querySelector('video');const handleKeyDown = (event) => {&nbsp; e.preventDefault();&nbsp; if (e.keyCode === 39) {&nbsp; &nbsp; const seconds = $video.currentTime;&nbsp; &nbsp; $video.currentTime = seconds + 10;&nbsp; }}$video.addEventListener('keydown', handleKeyDown);<video width="320" height="200">&nbsp; <source src="your/file.mp4" type="video/mp4"></video><p>Hello</p>

Answer 3

这可能会对您有所帮助。https://www.codespeedy.com/forward-and-backward-html5-video-player-javascript/您可以使用 event.preventDefault() 来阻止默认转发并通过添加 currentTime + 10 秒来设置手动转发。