<video>.currentTIme doesn't want to be set

问题

I'm trying to write a piece of Javascript that switches between two videos at timed intervals (don't ask). To make matters worse, each video has to start at specific place (about ten seconds, and again, don't ask.)

I got the basics working by just using the YUI Async library to fire to switch the videos at intervals:

YUI().use('async-queue', function (Y) {
                        // AsyncQueue is available and ready for use.

                        var cumulativeTime = 0;
                        var q = new Y.AsyncQueue()

                        for (var x = 0; x < settings.length; x++) {

                            cumulativeTime = cumulativeTime + (settings[x].step * 1000)

                            q.add( {

                                fn: runVideo,
                                args: settings[x].mainWindow,
                                timeout: cumulativeTime
                            })
                        }

                        q.run()
                    });

So far, so good. The problem is that I can't seem to get the video to start at ten seconds in.

I'm using this code to do it:

function runVideo(videoToPlay) {

    console.log('We are going to play -> ' + videoToPlay)

    var video = document.getElementById('mainWindow')
    video.src = '/video?id=' + videoToPlay

    video.addEventListener('loadedmetadata', function() {

        this.currentTime = 10 // <-- Offending line!
        this.play();

    })
}

The problem is that this.currentTime refuses to hold any value I set it to. I'm running it through Chrome (the file is served from Google Storage behind a Google App Engine Instance) and when the debugger goes past the line, the value is always zero.

Is there some trick I'm missing in order to set this value?

Thanks in advance.

来源：https://stackoverflow.com/questions/18105160/video-currenttime-doesnt-want-to-be-set