jQuery ajax() preloading multiple things

Question

I am using the following code to preload an mp3:

$.ajax({
    url: "boom.mp3",
    success: function() {
        //done
    }
});

Is there anyway I can have multiple elements preloaded (images and mp3 for example)?

e.g.

$.ajax({
    url: "boom.mp3", "moo.jpg",
    success: function() {
        //done
    }
});

Cheers!

Answer 1

If you are using jQuery 1.5, there are two new ways to handle this: deferred and promises.

Creating Responsive Applications Using jQuery Deferred and Promises

function successFunc(){
  console.log( “success!” );
}    

function failureFunc(){
  console.log( “failure!” );
}

$.when(
  $.ajax( "/main.php" ),
  $.ajax( "/modules.php" ),
  $.ajax( "/lists.php" )
).then( successFunc, failureFunc );

To use this in your instance, for example, just replace the ajax requests with load.

Answer 2

An idea from me: Collect all filenames in an array and loop through the array. Save th received opjects in another array and use it for what you want.

Perhaps it will work if you define the object in the url parameter, seperated by colon.

Answer 3

<script>
$.ajax({
    type:"GET",
    url:'',
    dataType:'json',
    async:false,
    beforeSend:function(data){ // Are not working with dataType:'jsonp'
      $('#content').html('Loading...');
    },
    success:function(data){
        $('#content').html(data.content);
    }
});
</script>

Read beforeSend(jqXHR, settings)