JSFiddle - React, Tailwind, and code Playground

by marhaba

HTML

<a href="#" id="notglobal">Don't use global error handling</a><br />
<a href="#" id="global">This uses global error handling</a>

JavaScript

$(function(){
    var handledLocally = false;
    $('html').ajaxError(function(e, xhr, settings, exception) {
        if (!handledLocally){
            if (xhr.status == 404) {
                alert("html error callback");    
            }
            handledLocally = false;
        }
    });
    
    //click event for the link that will show you both alerts
    $("#global").click(function(){
        $.ajax({
            url: "missing.html",
            error: function(xhr){
                if (xhr.status == 404) {
                    alert("foo");    
                }
            }
        });
    });
 
    //click event for the link that will show you on 1 alert
    $("#notglobal").click(function(){
        $.ajax({
            url: "missing.html",
            error: function(xhr){
                if (xhr.status == 404) {
                    alert("foo");   
                    handledLocally = true;
                }
            }
        });
    });
});