Home > Article > Web Front-end > How to implement ajax loading timeout prompt

How to implement ajax loading timeout prompt

php中世界最好的语言Original: 2018-04-25 14:57:502050browse

This time I will show you how to implement the ajax loading timeout prompt. What are the precautions for implementing the ajax loading timeout prompt. The following is a practical case, let's take a look.

index.php

<!doctype html>
<html>
  <head>
    <meta charset="utf-8"/>
    <title>加载超时</title>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7/jquery.min.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      function load(){
        $("#tips").html("加载中...");
        $.ajax({
          async:true,
          cache:false,
          timeout:8000,
          type:"POST",
          url:"result.php",
          data:{a:'123'},
          error:function(jqXHR, textStatus, errorThrown){
            if(textStatus=="timeout"){
              $("#tips").html("加载超时，请重试");
            }else{
              alert(textStatus);
            }
          },
          success:function(msg){
            $("#tips").html(msg);
          }
        });
      }
    </script>
    <input type="button" id="load" onclick="load();" value="点击加载"/>
    <p id="tips"></p>
  </body>
<html>

result.php

<?php
//sleep(20);
sleep(2);
echo $_POST['a'].'test服务器返回结果';

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!

How to implement ajax loading timeout prompt

Related articles