How to remove div when iframe fully loaded with jQuery

Question

Possible Duplicate:
Javascript callback when IFRAME is finished loading?

Is there any way to wait until an iframe has fully loaded before removing a div?

I'm using the following:

  $("#myButton").click(function(event){
        $('#response').html("<img src='images/ajax-loader.gif' border=0> Please Wait - Loading!");
        $("#myIFrame").attr('src', $('#url').val());
  });

I'd like to remove the loading gif once the iFrame fully loads.

Any ideas?!

Thanks!!!

are you using AJAX currently in your application? What language other than java script are you using? There may be a better way in general to do this. — Jacob Nelson, Sep 17 '10 at 15:35

score 3 · Accepted Answer · answered Sep 17 '10 at 15:34

You can simply use the load event on your iframe:

 $("#myButton").click(function(event){
        $('#response').html("<span id='loader'><img src='images/ajax-loader.gif' border=0> Please Wait - Loading!</span>");
        $("#myIFrame").attr('src', $('#url').val());
  });

  $('#myIFrame').load(function(){
    $("#loader").remove();
  });

How to remove div when iframe fully loaded with jQuery

1 Answers1