jQuery catch img

Question

We have a script used for each .item:

$(".item").each(function(){
    item_link = "http://...";
    block = $('.block', this);
    $.get(item_link, function(data) {
        var src = $('img.slide', data).attr('src');
        block.html(src);
    });
});

item_link variable is uniquie for each query.

There can be 100 .item or more.

The problem is - server has limit on connections at the same time, that why some .item get var src, some not.

The best solution is to use just one .get at the same time. I think there should be some counter, if .get is finished - it gives message "I'm finished, you can start" to the next .get and so on.

How to do that?

Thanks.

Answer 1

you should just put them all in one big request and let the server loop through them instead:

items_ids = [];
$(".item").each(function(){
    item_ids.push( some_identifier_for_the_item );
});

get_item_data_link = "http://...";
$.get(item_link, {"items": item_ids}, function(data) {
    ... loop through the results and stick them in the page
});

PS - if you're still set on making a request queue use push, pop, shift and unshift

First in first out queue:

queue = [];

// add 3 items to the queue
queue.push('item1');
queue.push('item2');
queue.push('item3');

// get the oldest item off the queue (ie. the first item
// added is the first item handled)

queue.shift(); // "item1"

Last in, first out queue:

queue = [];

// add 3 items to the queue
queue.push('item1');
queue.push('item2');
queue.push('item3');

// get the newest item off the queue (ie. the last item
// added is the first item handled)

queue.pop(); // "item3"