jquery ajax queue

by Juan Muñoz

HTML

<textarea id="log"></textarea>
<h1>Stop a page from exit with jQuery</h1>

<button id="reload">Refresh a Page in jQuery</button>

CSS

#log{
    width: 500px;
    height:200px;
}

JavaScript

$('#reload').click(function() {
 
	 	location.reload();
 
	});
	
	$(window).bind('beforeunload', function(){
		return '>>>>>Before You Go<<<<<<<< \n Your custom message go here';
	});
var i = 0;

function log(s) {
    $('#log').val($('#log').val() + '\n' + (++i) + ': ' + s);
}


//note: you can use any element you want, I just used document for simplicity.
//any element can have as many queues attached as you like

$(document).queue('myAjaxQueue', function() {
    $.ajax({
        url: 'test1',
        success: function(data) {
            log('callback 1');
            //call the next in line
            $(document).dequeue('myAjaxQueue');
        }
    });
});

$(document).queue('myAjaxQueue', function() {
    $.ajax({
        url: 'test1',
        success: function(data) {
            log('callback 2');
            //call the next in line
            $(document).dequeue('myAjaxQueue');
        }
    });
});

//start the queue
$(document).dequeue('myAjaxQueue');