zoukankan      html  css  js  c++  java
  • Ajax定时局部刷新

    1、局部刷新一个地方

    function refreshOnTime(){
        $.ajax({
        //配置
        });
        //7秒后重复执行该函数
        setInterval('refreshOnTime', 7000);
    }
     
    //开始执行自己
    refreshOnTime();
     
    //这样写的话,就会无限的重复执行自己,每次执行完后延迟自定义秒再次执行自己,且互不干扰

    2、例如:刚开始是加载所有的数据(三个区域是不同的方法读取数据,刷新的时间分别是5,6,7s)

    第5秒应该是刷新第一个区域

    第6秒应该是刷新第二个区域

    第7秒应该是刷新第三个区域

    //加载区域1
    function refreshArea1(){
        $.ajax({
        //配置
        });
    }
    //加载区域2
    function refreshArea2(){
        $.ajax({
        //配置
        });
    }
    //加载区域3
    function refreshArea3(){
        $.ajax({
        //配置
        });
    }
    //定时刷新
    function refreshOnTime(){
        //首先刷新区域1
        refreshArea1();
        //在区域1刷新之后的1秒后加载区域2
        setInterval('refreshArea2', 1000);
        //在区域2刷新之后的1秒后加载区域3
        setInterval('refreshArea3', 1000);
        //在自定义秒后重复该函数
        setInterval('refreshOnTime', 5000);
    }
    //首先加载所有区域
    refreshArea1();
    refreshArea2();
    refreshArea3();
    //设置的延迟时间是5,则执行顺序为,开始的第5秒,执行1,延迟1秒,即第6秒执行2,再延迟1秒,即第7秒执行3。
    //每间隔5秒重复一次,重复时,2始终比1慢1秒,3始终比2慢1秒
    refreshOnTime();
  • 相关阅读:
    【Docker】11 私有仓库
    【Docker】10 容器存储
    【TypeScript】02 面向对象
    【TypeScript】01 基础入门
    【Spring】08 后续的学习补充 vol2
    【Vue】15 VueX
    【Vue】14 UI库
    【Vue】13 VueRouter Part3 路由守卫
    【Vue】12 VueRouter Part2 路由与传参
    【DataBase】SQL50 Training 50题训练
  • 原文地址:https://www.cnblogs.com/wxh04/p/4431634.html
Copyright © 2011-2022 走看看