JavaScript для цикла делает пользовательский интерфейс невосприимчивым

Question

Я создаю скрипт списка рассылки, который использует ajax (async = false) для отправки электронных писем в кусках.

В основном цикл это:

var i = 0; 
for(i;i<num_rows;i=i+mxt){ 
    if($("#panic").val()=='1'){ 
     break; 
    } 
    perc = (i*100)/num_rows; 
    startThread(i,perc); 
} 

значение паники Tha устанавливается с помощью кнопки, проблема заключается в том, что во время цикла (который работает), я не могу взаимодействовать со страницей.

Что я делаю неправильно?

Спасибо

EDIT:

function startThread(i,perc){ 
l_a = i; 
l_b = mxt; 

headers = '&mail_from='+mail_from+'&mail_from_name='+mail_from_name+'&mail_subject='+mail_subject; 

$.ajax({ 
    type: "POST", url: "ajax/thread.php", data: "l_a="+l_a+"&l_b="+l_b+headers, 
    success: function(html){ $("#progressbar").progressbar({value: perc}); }, 
    async: false 
}); 
} 

Answer 1

Ваше startThread() имя функции вводит в заблуждение, потому что JavaScript в веб-браузеров не только однопотоковый, но она разделяет те же нити с рендеринга страницы.

Поскольку вы используете async=false, вызов $.ajax становится блокирующей функцией, и это блокирует поток рендеринга страницы, что делает пользовательский интерфейс невосприимчивым.

Цитируя jQuery documentation (курсив):

асинхронной

По умолчанию: истинный

По умолчанию все запросы асинхронно (т.е. это устанавливается истина по умолчанию) , Если вам нужны синхронные запросы, установите для этого параметра значение false. Междоменные запросы и dataType: запросы «jsonp» не поддерживают синхронную работу. Обратите внимание, что синхронные запросы могут временно блокировать браузер, отключая любые действия, пока запрос активен.

Возможные решения:

• Piggyback ваши данные в одном объекте JSON, и отправить только один запрос $.ajax. Если возможно, используйте async=true.