Как разместить запросы jQuery ajax?

Question

Я много искал и не думаю, что могу найти то, что я ищу.

У меня есть система, подобная тому, как работает твиттер, где вам нужно добавить (или следовать в Twitter) несколько человек одним нажатием кнопки.

Так, например, каждый раз, когда я нажимаю кнопку «Добавить» ниже, он делает запрос AJAX для добавления их в базу данных.

<ul> 
    <li>Ben <a href="#" onclick="return addPerson(1);">Add</a></li> 
    <li>Sarah <a href="#" onclick="return addPerson(2);">Add</a></li> 
    <li>Chantelle <a href="#" onclick="return addPerson(3);">Add</a></li> 
    <li>Alan <a href="#" onclick="return addPerson(4);">Add</a></li> 
</ul> 

Теперь, если я нажму кнопку добавления для каждого человека, один за другим, я не думаю, что в очереди один запрос Ajax для каждого человека будет хорошее использование ресурсов. Плюс это было бы медленно.

Я думаю, что это может быть задержка или что-то в этом роде после того, как я нажму кнопку «Добавить». Таким образом, он записывает все идентификаторы людей, которых я нажимаю, и отправляет один запрос ajax для всех людей, которых щелкнули.

Есть ли существующий скрипт или вы можете рекомендовать, как я мог это сделать?

Answer 1

Может, что-то вроде этого сделать трюк?

var sendDelay; 
var peopleToSend = []; 
addPerson = function(id) { 
    if (sendDelay!=null) { 
     clearTimeout(sendDelay); // Clear timeout 
    } 
    sendDelay=setTimeout(addPersonDelayComplete,2000); // Reset timeout 
    peopleToSend.push(id); // Add person to array 
} 

addPersonDelayComplete = function() { 
    // Send the people in peopleToSend in a single ajax call here 
    peopleToSend.length = 0; // Reset the array 
}