w3resource

jQuery: Register a handler to be called when all Ajax request have been completed

jQuery Fundamental - I : Exercise-15

Register a handler to be called when all Ajax requests have completed.

Note: Set up a basic Ajax load request, attach the event handler to the document. Now make an Ajax request using any jQuery method.

Sample solution :

HTML Code :

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Register a handler to be called when all Ajax requests have completed.</title>
</head>
<body>
<div class="jquery">jQuery: Click here</div>
<div class="result"></div>
<div class="log"></div>
</body>
</html>

JavaScript Code :

$( document ).ajaxStop(function() {
  $( ".log" ).text( "Triggered ajaxStop handler." );
});

$( ".jquery" ).click(function() {
  $( ".result" ).load( "https://www.w3resource.com/jquery-exercises/jq-ajax-test.html" );
});

Used Methods :

  • .ajaxStop() : Register a handler to be called when all Ajax requests have completed. This is an Ajax Event.

See the Pen jquery-fundamental-exercise-15 by w3resource (@w3resource) on CodePen.


Contribute your code and comments through Disqus.

Previous: Register a handler to be called when the first Ajax request begins.
Next: Attach a function to be executed whenever an Ajax request completes successfully.

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.