jQuery Ajax无法捕获404 [重复]

Question

This question already has answers here:

                </div>
            </div>
                    <div class="grid--cell mb0 mt4">
                        <a href="/questions/1637019/how-to-get-the-jquery-ajax-error-response-text" dir="ltr">How to get the jQuery $.ajax error response text?</a>
                            <span class="question-originals-answer-count">
                                (11 answers)
                            </span>
                    </div>
            <div class="grid--cell mb0 mt8">Closed <span title="2018-03-21 09:43:44Z" class="relativetime">2 years ago</span>.</div>
        </div>
    </aside>

I am trying to use AJAX to populate my dropdown list and I am returning a 404 with error message from my controller, and Ajax is not catching it...

My return at the controller is

return Response()->json(array('error' => '404 car type not found'), 404);

And here is my JS

$('document').ready(function () {
$('#car_type').bind('changed.bs.select', function () {
    $.ajax({
        type: 'POST',
        url:'carclass/'+$('#car_type').val(),
        dataType: 'json',
        error: function(XMLHttpRequest, textStatus, errorThrown){
            alert('status:' + XMLHttpRequest.status + ', status text: ' + XMLHttpRequest.statusText);
        },
        success: function( json ) {
           $.each(json, function(i, obj){
                $('#car_class').append($('<option>').text(obj.name).attr('value', obj.id));
           });
           $('#car_class').selectpicker('refresh');
        }
});
 });
 });

It is returning

GET http://localhost:8000/ads/cartype/2 404 (Not Found)

</div>

Answer 1

Replace your error block with something like this where xhr.status will give you the status code of the response.

error:function (xhr, ajaxOptions, thrownError){
    if(xhr.status==404) {
        alert('status:' + xhr.status + ', status text: ' + xhr.statusText);
    }
}