Что такое ajax error

The required parameters in an Ajax error function are jqXHR, exception and you can use it like below:

$.ajax({
    url: 'some_unknown_page.html',
    success: function (response) {
        $('#post').html(response.responseText);
    },
    error: function (jqXHR, exception) {
        var msg = '';
        if (jqXHR.status === 0) {
            msg = 'Not connect.n Verify Network.';
        } else if (jqXHR.status == 404) {
            msg = 'Requested page not found. [404]';
        } else if (jqXHR.status == 500) {
            msg = 'Internal Server Error [500].';
        } else if (exception === 'parsererror') {
            msg = 'Requested JSON parse failed.';
        } else if (exception === 'timeout') {
            msg = 'Time out error.';
        } else if (exception === 'abort') {
            msg = 'Ajax request aborted.';
        } else {
            msg = 'Uncaught Error.n' + jqXHR.responseText;
        }
        $('#post').html(msg);
    },
});

DEMO FIDDLE

Parameters

jqXHR:

Its actually an error object which is looks like this

You can also view this in your own browser console, by using console.log inside the error function like:

error: function (jqXHR, exception) {
    console.log(jqXHR);
    // Your error handling logic here..
}

We are using the status property from this object to get the error code, like if we get status = 404 this means that requested page could not be found. It doesn’t exists at all. Based on that status code we can redirect users to login page or whatever our business logic requires.

exception:

This is string variable which shows the exception type. So, if we are getting 404 error, exception text would be simply ‘error’. Similarly, we might get ‘timeout’, ‘abort’ as other exception texts.

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are deprecated as of jQuery 1.8. To prepare
your code for their eventual removal, use jqXHR.done(), jqXHR.fail(),
and jqXHR.always() instead.

So, in case you are using jQuery 1.8 or above we will need to update the success and error function logic like:-

// Assign handlers immediately after making the request,
// and remember the jqXHR object for this request
var jqxhr = $.ajax("some_unknown_page.html")
    .done(function (response) {
        // success logic here
        $('#post').html(response.responseText);
    })
    .fail(function (jqXHR, exception) {
        // Our error logic here
        var msg = '';
        if (jqXHR.status === 0) {
            msg = 'Not connect.n Verify Network.';
        } else if (jqXHR.status == 404) {
            msg = 'Requested page not found. [404]';
        } else if (jqXHR.status == 500) {
            msg = 'Internal Server Error [500].';
        } else if (exception === 'parsererror') {
            msg = 'Requested JSON parse failed.';
        } else if (exception === 'timeout') {
            msg = 'Time out error.';
        } else if (exception === 'abort') {
            msg = 'Ajax request aborted.';
        } else {
            msg = 'Uncaught Error.n' + jqXHR.responseText;
        }
        $('#post').html(msg);
    })
    .always(function () {
        alert("complete");
    });

• Связанные категории:
• Ajax
  » Global Ajax Event Handlers

Returns: jQuery

Прикрепляет функцию, которая выполнится каждый раз при неудачном ajax-запросе.

• version added: 1.0.ajaxError( handler(event, jqXHR, ajaxSettings, thrownError) )

  
  .ajaxError( handler(event, jqXHR, ajaxSettings, thrownError) )

  Тип: функция

  Функция, которая будет вызвана.

Каждый раз, когда ajax запрос будет выполняться неудачно, jQuery вызовет событие ajaxError. В этот момент выполняются все обработчики события зарегистрированные через метод .ajaxError(). Данный обработчик не запускается при вызове кросс-доменных скриптов, а так же кросс-доменных JSONP запросов.

Для проверки работы данного метода в действии, можно создать простой Ajax запрос.

<button class="trigger">Trigger</button>
<div class="result"></div>
<div class="log"></div>

Прикрепление события к документу:

$(document).ajaxError(function() {
  $( "div.log" ).text( "Triggered ajaxError handler." );
});

Далее, делаем Ajax запрос с помощью jQuery:

$( "button.trigger" ).on( "click", function() {
  $( "div.result" ).load( "ajax/missing.html" );
});

После клика по кнопке с классом trigger и неудачном ajax запросе (из-за отсутствия файла), будет отображено лог сообщение.

Начиная с jQuery 1.8, метод .ajaxError() нужно прикреплять только к document.

Все обработчики события ajaxError запускаются после неудачного Ajax запроса. Для того, чтобы отличить множественные запросы, можете воспользоваться дополнительными параметрами, переданными в функцию-обработчик. В функцию обработчик передаётся объект события, объект jqXHR, а так же объект настроек ajax запроса. При возникновении HTTP ошибки, её текстовой статус (пр. «Not Found», «Internal Server Error») будет записан в четвёртый аргумент. К примеру, выполняем функционал в зависимости от настроек URL на который был сделан Ajax запрос:

$( document ).ajaxError(function(event, jqxhr, settings, exception) {
  if ( settings.url == "ajax/missing.html" ) {
    $( "div.log" ).text( "Triggered ajaxError handler." );
  }
});

Дополнительные заметки:

• Метод .ajaxError() не сработает если при вызове $.ajax() или $.ajaxSetup() в настройке global стоит значение false.

Пример:

Показать сообщение при неудачном Ajax запросе.

$(document).ajaxError(function(event, request, settings) {
  $( "#msg" ).append( "<li>Error requesting page " + settings.url + "</li>" );
});

Связанные уроки:

• 

  Используем jQuery. 15 советов.

  В данном уроке приводится 15 рекомендаций по работе с библиотекой jQuery. Описанные методы помогают эффективно использовать мощный инструмент разработчика.