Why does setting currentTime of HTML5 video element reset time in Chrome?

问题

I want to set the time position of a video in HTML5. The time should be set like this:

function settime(){
    var video = document.getElementById("video1");
    console.log(video.currentTime); //----->output for example 15.3
    video.currentTime = 10.0;
    console.log(video.currentTime);//----->>output always 0
}

And the video is embedded like this:

<button onclick="settime();">Set Time</button>
<div class="container">
<video id="video1" class="video-js vjs-default-skin" muted>
     <source src="video.m4v" type="video/mp4" />
     HTML5 Video is required for this example.
</video>

But for some reason, this always just resets currentTime to 0 in Chrome.

Why gets the time reset when setting currentTime? And how can I set currentTime correctly?

回答1:

I finally figured out an answer! Chrome requires you to set the currentTime as a String, and not as a number.

function settime() {
    var video = document.getElementById("video1");
    console.log(video.currentTime); // output 0
    video.currentTime = 10.0;
    console.log(video.currentTime); // output 0 for some chrome users or 10 for firefox and others
    video.currentTime = "10.0";
    console.log(video.currentTime); // output 10
}

settime();

<audio id="video1" src="https://sample-videos.com/audio/mp3/crowd-cheering.mp3" controls></audio>
<div>Click play to start the audio at 10 s.</div>

回答2:

It should be

var video = document.getElementById("video1");

as you have

<video id="video1" class="video-js vjs-default-skin" muted>

来源：https://stackoverflow.com/questions/36783521/why-does-setting-currenttime-of-html5-video-element-reset-time-in-chrome