Execute Function Before AJAX Call Ends - jQuery Just Wait

Just Wait is a tiny jQuery plugin that adds a wait() callback to AJAX requests.

The plugin enables you to trigger a function after a specified amount of time has elapsed from the start of the AJAX call.

A typical use of the plugin is to create a loading indicator when the AJAX call is in progress.

How It Works:

• AJAX request starts.
• Start counting up to a specified amount of time (defaults to 100ms).
• Determine whether the AJAX request has ended.
• If Yes, stop counting.
• If No, determine whether a specified period of time has elapsed since the start of the AJAX request.
• If Yes, call the wait() callback.

How to use it:

1. Download & unzip the plugin and then insert the just-wait.min.js after jQuery.

<script src="/?originalUrl=https%3A%2F%2Fwww.jqueryscript.net%2F%26quot%3B%2Fpath%2Fto%2Fcdn%2Fjquery.min.js%26quot%3B%26gt%3B%26lt%3B%2Fscript%26gt%3B%26lt%3Bscript%2520src%3D%26quot%3B%2Fpath%2Fto%2Fdist%2Fjust-wait.min.js%26quot%3B%26gt%3B%26lt%3B%2Fscript%26gt%3B%253C%2Fpre">
2. Add the wait() callback to your AJAX request.
$.get('url')
  .wait(() => {
    // do something after 100ms (default)
  })
  .done((data) => { 
    // do something after the data is fetched
  })
  .fail(() => { 
    // do something when the data fails to load
  })
  .always(() => { 
    // do something after The AJAX request ends.
});

3. override the default JustWait time in milliseconds.
JustWait.options.waitFor = 300;

// or
$.get({
  url: '/path/to/data',
  waitFor: 300
})

$.ajax({
  url: '/path/to/data',
  waitFor: 300
})

$.post({
  url: '/path/to/data',
  data: { id: 3 },
  waitFor: 300
})


This awesome jQuery plugin is developed by OmarMuscatello. For more Advanced Usages, please check the demo page or visit the official website.





Prev: Unobtrusive Loading Screen & Loading Bar - JQLoader 
Next: Animated Progress Gauge With jQuery – jsProgressBar