[jquery] Jquery Ajax Loading image

<div id="loading" style="display:none">Your Image</div>

<script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script>
    $(function () {
        var loading = $("#loading");
        $(document).ajaxStart(function () {
            loading.show();
        });

        $(document).ajaxStop(function () {
            loading.hide();
        });

        $("#startAjaxRequest").click(function () {
            $.ajax({
                url: "http://www.google.com",
                // ... 
            });
        });
    });
</script>

<button id="startAjaxRequest">Start</button>

Examples related to jquery

• How to make a variable accessible outside a function? • Jquery assiging class to th in a table • Please help me convert this script to a simple image slider • Highlight Anchor Links when user manually scrolls? • Getting all files in directory with ajax • Bootstrap 4 multiselect dropdown • Cross-Origin Read Blocking (CORB) • bootstrap 4 file input doesn't show the file name • Jquery AJAX: No 'Access-Control-Allow-Origin' header is present on the requested resource • how to remove json object key and value.?

Examples related to ajax

• Getting all files in directory with ajax • Cross-Origin Read Blocking (CORB) • Jquery AJAX: No 'Access-Control-Allow-Origin' header is present on the requested resource • Fetch API request timeout? • How do I post form data with fetch api? • Ajax LARAVEL 419 POST error • Laravel 5.5 ajax call 419 (unknown status) • How to allow CORS in react.js? • Angular 2: How to access an HTTP response body? • How to post a file from a form with Axios