Я довольно новичок в Ajax, но я подумал, что смысл его использования - это «асинхронная» часть. К сожалению, я словно застрял в синхронном аду.
В начале моей страницы создано несколько элементов, каждый из которых имеет уникальный идентификатор.
В самом конце моей страницы, используя jQuery, я перебираю каждый элемент и выполняю вызов ajax () (где я явно устанавливаю 'async' в true!). В настоящее время завершено, каждый вызов Ajax просто заполняет соответствующий элемент некоторым выводом текста. В конце концов это будет IMG.
Что происходит, так это то, что я получаю «занятый» курсор мыши на странице, и некоторые элементы не заполняются до тех пор, пока не вернутся все (17) XHR-запросы.
Вот мой вызов jQuery:
jQuery('.ajax-item').each(function(index){
$item = jQuery(this);
ID = $item.attr('id');
//$item.load(WPGlobals.ajaxurl, { 'action' : 'my-action', 'ID' : ID });
jQuery.ajax({
url : WPGlobals.ajaxurl,
type : 'POST',
async : true,
data : { 'action' : 'my-action', 'ID' : ID },
success : function(response){ $item.html(response) }
});
});
Глядя на этот код (выше), вы заметите, что это сайт WordPress (хотя я не знаю, что это будет делать с чем-либо), и что я также попробовал более простой метод load() и переключился на ajax(), чтобы я мог форсировать async : true на случай, если из-за какой-то странной WP произошел какой-нибудь смешной беспорядок с глобалами.
Правильно ли я поступаю? Разве моя страница не должна загружаться независимо от AJAX, и тогда эти элементы будут просто лениво заполняться при входе XHR?
РЕДАКТИРОВАТЬ - я только что заметил, что моя логика запуталась в статическом вызове; Вероятно, мне нужно закрытие, чтобы правильно настроить область действия $ item, но это не относится ни к вопросу асинхронности, ни к тому, что здесь и там - все равно запускается 17 XHR и ждет, пока все они вернутся домой до завершения загрузки страницы.