Добрый день, уважаемые форумчане.
Возникла некоторая проблема, которую никак не получается решить.
Использую для отправки формы следующий способ с jQuery:
//...
$(document).ready(function() {
//...
//валидация полей формы и т.д.
$("#add-form").submit(function(e, data) {
if (data == 'cansubmit') return true;
e.preventDefault();
var encodedParams = $.toJSON(rParams);
$.ajax({
url: '/core/'+hUrl,
type: 'POST',
data: hData+"="+encodedParams,
beforeSend: function() {
$("#btn").val('Загрузка...');
$("#btn").attr('disabled','disabled');
},
success: function(response) {
console.log(response);
if (response == 'ok') {
$('#add-form').trigger('reset');
$('#add-form').trigger('submit', 'cansubmit');
} else {...}
},
error: function(){
//...
$("#btn").val('Добавить');
$("#btn").removeAttr('disabled');
}
});
});
});
Суть проблемы в том, что при тестировании не на локальном сервере, а на VPS после нажатия на кнопку перед отправкой данных браузер подвисает на некоторое время (примерно полсекунды), но это подвисание достаточно хорошо ощущается. Кнопка залипшей остается.
Для проверки сделал php-файл c delay(5), чтобы проверить, работает ли скрипт асинхронно. Таким образом получается, что сначала происходит подвисание, потом браузер отлипает и срабатывает beforeSend и кнопка меняет значение, а через 5 секунд кнопка снова возвращает старое значение, успешно дождавшись ответа.
Периодически подвисания нет, словно какие-то данные достаются из кэша и все отрабатывает нормально.
Подвисания нет, если убрать конструкцию $.ajax() из кода.
В чем может быть проблема?
Буду очень благодарен всем откликнувшимся.