How to make ajax request for monitoring page with jQuery-JS Tutorial-php.cn

How to make ajax request for monitoring page with jQuery

php中世界最好的语言

Release： 2018-04-24 17:03:39

Original

1766 people have browsed it

This time I will bring you jQueryHow to make an ajax request for the monitoring page, what are the precautions for jQuery to make an ajax request for the monitoring page, the following is a practical case, let’s take a look take a look.

Have you ever encountered such a problem: the page initiates two ajax requests, hoping that they will succeed before taking another action?

The solution that is easy to think of is to wait for one of them to end before initiating the other one. This process is completed using the callback function.

However, what should you do if one of the ajax request codes is not written by you and you cannot change it?

In other words, you just want to know when a certain URL request ends and don't want to worry about other requests. How to do it?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <p id="test"></p>
  </body>
  <script src="js/jquery-1.11.0.min.js"></script>
  <!--首先在页面引入jquery的后面，紧接着以下代码：-->
  <script>
    //前提：所有ajax请求都是用jquery的$.ajax发起的，而非原生的XHR；
    var ajaxBack = $.ajax;
    var ajaxCount = 0;
    var allAjaxDone = function(){$('#test').append('all done!<br>');} //一行代码，就可以知道所有ajax请求什么时候结束
    //由于get/post/getJSON等，最后还是调用到ajax，因此只要改ajax函数即可
    $.ajax = function(setting){
      ajaxCount++;
      var cb = setting.complete;
      setting.complete = function(){
        if($.isFunction(cb)){cb.apply(setting.context, arguments);}
        ajaxCount--;
        if(ajaxCount==0 && $.isFunction(allAjaxDone)){
          allAjaxDone();
        }
      }
      ajaxBack(setting);
    }
  </script>
  <!--以下是别人的script-->
  <script>
    $.ajax({url: 'js/jquery-1.11.0.min.js', success: function(recv){$('#test').append('别人的ajax请求1，done<br>')}});
  </script>
  <script>
    $.get('css/main.css', null, function(recv){$('#test').append('别人的get请求，done<br>')});
  </script>
  <script>
    $.post('css/main.css', null, function(recv){$('#test').append('别人的post请求，done<br>')});
  </script>
</html>

Copy after login

Other related functions:

$.ajax in:

error: called when an error occurs, can be used to report incorrect requests.
complete: Will be called regardless of success or failure

In higher versions:

$.promise
$.when

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Detailed explanation of Ajax usage steps

The above is the detailed content of How to make ajax request for monitoring page with jQuery. For more information, please follow other related articles on the PHP Chinese website!