Javascript function not always loading after element is ready

I have a Javasript function that doesn’t always get run through. The function is under a jQuery.bind, that is attached to the video player on the page. Once the video player is ready the function should run, some elements of the functions depend on the duration of the video which can only be obtained once the video player is ready.

It seems to work a good majority of the time, but sometimes (3/10 times) it doesn’t. Not sure why this is happening.

Read More
ML = (typeof ML === "undefined") ? {} : ML;
ML.player = null;

//Initialization of the video player
jQuery(document).ready(function() {
    var vidId = vidIdRaw.split("/");
    ML.player = new SV.Player({
        videoId: vidId[0]
    });
    //More functions are initialized under the document.ready

    //Waits for video player to be ready before executing function
    //This is the function that doesn't always run
    ML.player.bind('ready', function(obj) {
        var isReady = true;
        jQuery('#duration-time').html(formatTime(ML.player.getDuration()));
        //Functions initialized above are called and run here as well.
    }
}

I left most of the functions out as there is a lot of code I’d have to include. I’ve included the relevant information.

Related posts

Leave a Reply

1 comment

  1. Try to bind the ready event on the player as soon as possible after its initialization; it’s possible that the code mentioned as “More functions are initialized…” takes to long to execute and you miss the ready event on the player.