1. 程式人生 > >Ajax實現定時從伺服器獲取資料,定時更新資料

Ajax實現定時從伺服器獲取資料,定時更新資料

一般來說,我們很容易想到用如下演算法來實現隔一段時間從伺服器取值:
var secs = 300; //倒計時的秒數 
function doUpdate(num)   
{   
	if (num % 3 == 0)
	{
		saveUserInfo();
	}  
}  
  
for(var i = secs; i >= 0; i--)   
{   
	window.setTimeout("doUpdate(" + i + ")", (secs-i) * 1000);
}  

就是用倒計時的原理,每當變數 secs 能夠整除 3,就執行 saveUserInfo() 函式,以實現每三秒從伺服器獲取一次值。但這麼做首先是不高效的,因為每次都需要作一次邏輯判斷。其次也程式不明瞭。


現在用迴圈巢狀的方式實現了這一功能。

function saveUserInfo()  
{  
    //獲取接受返回資訊層  
    var cdown = document.getElementById("cdown");  
	//alert(cdown);
  
    //接收表單的URL地址  
    var url = "word.php";  
  
    var ajax = false;  
    //開始初始化XMLHttpRequest物件  
    if(window.XMLHttpRequest)   
    {   //Mozilla 瀏覽器  
        ajax = new XMLHttpRequest();  
        if (ajax.overrideMimeType)   
        {   //設定MiME類別  
            ajax.overrideMimeType("text/xml");  
        }  
    }  
    else if (window.ActiveXObject)   
    {   // IE瀏覽器  
        try   
        {  
            ajax = new ActiveXObject("Msxml2.XMLHTTP");  
        }   
        catch (e)   
        {  
            try   
            {  
                ajax = new ActiveXObject("Microsoft.XMLHTTP");  
            }   
            catch (e) {}  
        }  
    }  
    if (!ajax)   
    {   // 異常,建立物件例項失敗  
        window.alert("不能建立XMLHttpRequest物件例項.");  
        return false;  
    }  
                  
    //通過Post方式開啟連線  
    ajax.open("GET", url, true);  
  
    //定義傳輸的檔案HTTP頭資訊  
    //ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
    
	ajax.setRequestHeader("If-Modified-Since","0");  
    //傳送POST資料  
    ajax.send(null);  
  
    //獲取執行狀態  
    ajax.onreadystatechange = function()   
    {   
        //如果執行狀態成功,那麼就把返回資訊寫到指定的層裡  
        if (ajax.readyState == 4 && ajax.status == 200)   
        {   
            cdown.innerHTML = ajax.responseText;   
        }   
    }   
}  
function doUpdate()   
{   
		saveUserInfo();
		window.setTimeout("doUpdate()", 8000);
}  
doUpdate();   

其實最關鍵的就是以下部分程式碼:

function doUpdate()   
{   
		saveUserInfo();
		window.setTimeout("doUpdate()", 8000);
}  
doUpdate();   

首先通過 doUpdate() 啟動函式執行,執行 doUpdate() 時,呼叫 saveUserInfo() 從伺服器取值,然後8秒後再呼叫自身,那麼就實現了,只要頁面存在多久,取值就會永遠迴圈下去。一個遞迴,使程式大大簡化了。

相關推薦

Ajax實現定時伺服器獲取資料定時更新資料

一般來說,我們很容易想到用如下演算法來實現隔一段時間從伺服器取值:var secs = 300; //倒計時的秒數 function doUpdate(num) { if (num % 3 == 0) { saveUserInfo(); } }

通過jquery ajax伺服器獲取一個檔案的資料顯示到客戶端的頁面

           問題背景:                        開啟記事本,寫一個html頁面,從本地讀一個檔案,顯示的頁面上,這個操作很容易實現。但是要想從讀伺服器上的一個檔案,然後想顯示到頁面上。光用普通的javascript技術和html知識是不夠用的

$.ajax()方法伺服器獲取json資料幾種方式詳解

一.什麼是json json是一種取代xml的資料結構,和xml相比,它更小巧但描述能力卻很強,網路傳輸資料使用流量更少,速度更快。 json就是一串字串,使用下面的符號標註。 {鍵值對} : json物件 [{},{},{}] :json陣列 "" :雙引號內是屬性或值

vue單頁應用中使用setInterval()定時伺服器獲取資料後來跳轉頁面後發現還在不停的獲取資料

使用VUE開發單頁專案時遇到這樣的問題,mounted中使用setInterval()定時向伺服器獲取資料,後來跳轉頁面後,發現還在不停的獲取資料。我以為是因為我路由用的push導致的,改成replace也是這樣,後來就在部落格園找到答案了,如下: http://www.cnblogs.com/zzbp/p/

Ajax定時伺服器資料

var secs = 300; //倒計時的秒數 function doUpdate(num) { if (num % 3 == 0) { saveUserInfo(); } } for

$.ajax()方法伺服器獲取json資料

一.什麼是jsonjson是一種取代xml的資料結構,和xml相比,它更小巧但描述能力卻很強,網路傳輸資料使用流量更少,速度更快。json就是一串字串,使用下面的符號標註。{鍵值對} : json物件[{},{},{}] :json陣列"" :雙引號內是屬性或值: :冒號前為

Android連線伺服器伺服器獲取資料以及伺服器下載檔案(單多執行緒)

首先需要在Eclipse中建立一個伺服器,在其中存入要下載的檔案,具體可參考之前的伺服器篇。 ScollView可以上下滑動 另外還有,android中的網路連線與之前java中可以通用,可以參照之前伺服器客戶端通訊篇。 新增的許可權

根據ajax伺服器獲取資料的時間和ID,根據最近的時間,顯示一個記錄重複ID的數字

success:function(data){  if(data.length>0){   var map = {};for (var i in data) {   var user_id = data[i]["USER_ID"];   if (map[user_id

php處理json資料(伺服器獲取post提交)

<?php /* author yangkaka 2016-02-29 php通過post傳送json資料 */ function http_post_json($url,$js

Unity 用C#指令碼Web伺服器獲取、解析Json檔案資料

需要在Plugins檔案下,匯入LitJson檔案。 (LitJson檔案) 連結:https://pan.baidu.com/s/1sSEPGbUm6tn7Y8huQm5v_w 密碼:5fzr 指令碼:using System.Collections; usin

小程式伺服器獲取資料以及帶參傳資料 php

此前沒有摸索過小程式,原本打算看視訊教學慢慢走的,發現老師講的基本都是文件,於是乾脆直接實踐。 要實現這樣一個排行 官方文件上的東西我就不照搬了 var that = this; wx.request({ //請求介面的地址

bootstrap-table的入門使用——伺服器獲取資料

也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!                這裡需要使用 bootstrap-table 外掛。使用了CSS3loader顯示載入過程。效果如下:index.html<!DOCTYPE html&g

過濾器通過HttpServletResponseWrapper包裝HttpServletResponse實現獲取response中的返回資料以及對資料進行gzip壓縮

前幾天我們專案總監給了我一個任務,就是將請求的介面資料進行壓縮,以達到節省流量的目的。 對於實現該功能,有以下思路: 1.獲取到response中的值, 2.對資料進行gzip壓縮(因為要求前端不變,所以只能選在這個瀏覽器都支援的壓縮方式) 3.將資料寫

GET方式伺服器獲取資料

<span style="font-size:18px;">import java.io.ByteArrayOutputStream; import java.io.IOException

JAVA+FTP實現伺服器獲取檔案支援區域網和外網

     1.FTP服務是filezilla server。 下載地址: https://filezilla-project.org/ 2.filezilla server安裝及配置教程 教程地址: https:

用windows搭建ntp時間伺服器上級獲取時間併為客戶機提供時間)

原文連結:https://blog.csdn.net/dsg333/article/details/44854221. 將伺服器型別更改為 NTP。為此,請按照下列步驟操作:a.  單擊“開始”,單擊“執行”,鍵入 regedit,然後單擊“確定”。 b.  找到並單擊下面的

Crawler/ML:爬蟲技術(基於urllib.request庫網頁獲取圖片)+HierarchicalClustering層次聚類演算法實現自動網頁獲取圖片然後根據圖片色調自動分類

網上教程太囉嗦,本人最討厭一大堆沒用的廢話,直接上,就是幹! 網路爬蟲?非監督學習? 只有兩步,只有兩個步驟? Are you kidding me? Are you ok? 來吧,follow me, come on! 一、爬蟲下載圖片 第一步:首先,我們從網

JQuery伺服器獲取資料

備註:引數不全 1.url:  要求為String型別的引數,(預設為當前頁地址)傳送請求的地址。 2.type:  要求為String型別的引數,請求方式(post或get)預設為get。注意其他http請求方法,例如put和delete也可以使用,但僅部分瀏覽器支援。 3.timeout:  要求為Num

php 使用webservice伺服器獲取資料時中文亂碼

本小白由於公司erp需求,讓我來搞webservice這塊。 伺服器端為本公司的伺服器,客戶端為自己的主機。 從伺服器的sql資料庫獲取了對於的資料後,從客戶端獲取了。 結果發現中文出現亂碼。 查看了多個地方引數。頁面沒問題,兩邊的引數設定都沒問題的。 webservic

ajax獲取後臺資料頁面Json資料按照json格式化輸出

樣式效果圖: 2.頁面程式碼: //查詢出對應的原始碼進行展示 function querySource(label) { var url = base_path+"console/cfg/querySource"; $.ajax({ url: