I am looking for a global event handler that shows the user that the process is running before each function runs.can you give an example for this, thanks.I use Juqery and mvc.

I wrote the following sample function to show the user that the process is in progress

function addUser()
{
      $("#backgroundProcess").show(); // The css file shows a circle rotating on the screen

      setTimeout(function () {
             // codes

      $("#backgroundProcess").hide();
      }
}

My problem is that it is getting boring to do this for every function.this time I wrote the following code to work in general, but the circle opens and closes very quickly.because I have to set each function to settimeout again for it to work.and this only works in ajax functions, it does not work in local functions that are not connected to the server.Also putting settimeout on every function slows down the system

    window.onload = function () {
        $(document).ajaxStart(function (e) {
            $("#backgroundProcess").show();
            
        });
        $(document).ajaxStop(function () {

            setTimeout(function () {
                $("#backgroundProcess").hide();
            }, 250)
        });
        $(document).ajaxError(function () {
            setTimeout(function () {
                $("#backgroundProcess").hide();
            }, 250)
        });
        $(document).ajaxComplete(function (e) {

            setTimeout(function () {
                $("#backgroundProcess").hide();
            }, 250)

        });
    }