JSFiddle - React, Tailwind, and code Playground

by jgarrido

HTML

<!DOCTYPE html><html>
<head>
</head>
<body>
    <button onclick="doAjax('/doh');">Same Domain (Does not exist)</button>
    <button onclick="doAjax('http://www.non-existant-url.com/');">X-Domain (Useless jqXHR object)</button>
</body>
</html>

JavaScript

function doAjax(url)
{
    $("body p").remove();
    
    $.ajax({
        type: "GET",
        url: url,
        success: function(data, textStatus, jqXHR){
            alert("Success");
        },
        error: function (xhr, textStatus, errorThrown) {
             console.log("xhr.status: " + xhr.status);
             console.log("xhr.statusText: " + xhr.statusText);
             console.log("xhr.readyState: " + xhr.readyState);
             console.log("textStatus: " + textStatus);
             console.log("errorThrown: " + errorThrown);
             console.log("xhr.redirect: " + xhr.redirect);
                },
        statusCode: {
            404: function () { console.log("statusCode event - 404"); },
            501: function () { console.log("statusCode event - 501"); },
            502: function () { console.log("statusCode event - 502"); }
        }
    });
}

console = window.console || {};
console.log = function(msg)
{
    $("body").append("<p>" + msg + "</p>");
}