How To Add Event Listener To Videojs When Start To Play A Video?

How do I add event listener to videojs when the video is start to play? (this event should be called at the begging of the play)? I searched on Player Events docs, but I can't find

Solution 1:

You can do this videojs way.

play.on('play', () => { });

Solution 2:

I suggest checking the docs for the <video> element.

You will see many events are emitted. Most importantly,

play - Playback has begun.

We can add an event listener to the element listening for this event:

document.querySelector('.video').addEventListener('play',  evt => { 
   // code you want to happen when the video plays
});

Note: document.querySelector('.video') is just a filler, select the element however you want to

I suggest this over @FlashThunder's solution because you can add multiple listeners and for other reasons.

Solution 3:

right there on the docs you have the timeupdate event, you could set a flag to true when it starts.

Solution 4:

That's only a "skin" for HTML5 player, you can access the original HTML5 element by .player() function, and then use those:

var vid = myplayer.player();
vid.onplay = function() {
    alert("The video has started to play");
};

player()

Return the component's player