CODEWITHSUNDEEP
jquery
smaj08r
smaj08r

Reputation: 229

function call from JQuery Event handler

I am new to JQuery. I have searched previous posts but couldn't find anything. I am trying to do call another function from Video Ended Event handler. its not working.

$(document).ready(function(){
   // doing something
   $("#video1").bind("ended", NextFrag());
});

function NextFrag(){
   Window.alert("Hello World");
}

This is not working. I cannot see any alert printing "Hello World".

Basically I need to solve the above problem to do the following task. I want to play different fragments of video. The algorithm should be something like this:

$(document).ready(function(){
   NextFrag();
});

function NextFrag(){

   // IF First FRAGMENT do this
      $("#video1").html('<source src="FirstURLFromArray.mp4" type="video/mp4"></source>' );

    // ELSE DO THIS
      $("#video1").bind("ended", function(){
         $("#video1").html('<source src="NextURLFromArray.mp4" type="video/mp4"></source>' );
         NextFrag();    // call itself again.       
      });
}

Any help will be very appreciated. Thanks,

Upvotes: 0

Views: 3628

Answers (3)

smaj08r
smaj08r

Reputation: 229

Thanks for your help. I just completed the task. I did something like this and it is working.

var index = 0;
$(document).ready(function(){
NextFrag();
});  

function NextFrag(){
if (index < url.length){
    if(index == 0 )
    {
        //The only difference for index=0 is that the player is not autoplay  
        $("#video1").html('<source src= " '+ url[index] + '" type="video/mp4"></source>' );
        index++;
        $("#video1").bind( "ended", NextFrag);

    }else
    {
         $("#VideoContainer").html('<video  id="video1" controls autoplay > "<source src= "'+ url[index]+ '" type="video/mp4"></source> </video>' );
         index++;
         $("#video1").bind( "ended", NextFrag);
    } 
}
}

Upvotes: 0

Talha Akbar
Talha Akbar

Reputation: 10030

$(document).ready(function(){
   $("#video1").on("ended", function() {
    NextFrag();
   });
});

function NextFrag(){
   alert("Hello World");
}

Upvotes: 2

Dogbert
Dogbert

Reputation: 222040

Try

$("#video1").bind("ended", NextFrag);

This will pass the function as a callback, instead of evaluating it.

Upvotes: 3

Related Questions