使用XMLHttpRequest在網頁中查看網頁

Question

我已經構建了一個Web應用程序，其中包含一個顯示html頁面內容的預覽窗口。由於html頁面不斷更新，我需要預覽窗口每0.5秒反映一次這些更改。

除預覽窗口在刷新時閃爍時，一切正常。這種情況有時只會發生，似乎很有氣質。大部分時間不閃爍，並且對html頁面的更新非常流暢。

這是代碼 - 任何人都可以提出任何建議，以防止發生閃爍？

//Get the preview data and insert/refresh it in the #preview-fram div 
    function refreshinfo(){ 
     var xmlhttp; 
     var id = $.urlParam('id'); 
     var grid = $.urlParam('grid');      


     if (window.XMLHttpRequest){ 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else{ 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function(){ 
     if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
      document.getElementById("preview-frame").innerHTML=xmlhttp.responseText; 
      } 
     } 

     xmlhttp.open("GET","http://webhost:8888/subs-banner-generator/preview?id="+id+'&grid='+grid,true); 
     xmlhttp.send(); 

     } 

     setInterval(refreshinfo, 500); //refresh the data every 0.5 secs 

Answer 1

1. 500ms的不是很多給
2. 不建議使用的setInterval阿賈克斯
3. 您標誌着這一jQuery的，爲什麼不使用它的服務器？

像這樣

function refreshinfo(){ 
    var id = $.urlParam('id'); 
    var grid = $.urlParam('grid'); 
    var url = "http://webhost:8888/subs-banner-generator/preview?id="+id+'&grid='+grid; 
    $("#preview-frame").load(url,function() { 
     setTimeout(refreshinfo,500); // will load the page again 500ms after successful load 
    }); 
} 
$(function() { 
    refreshinfo(); 
});