使用 XMLHttpRequest 在网页中查看网页

Question

我构建了一个包含预览 window 的网络应用程序，它显示 html 页面的内容。由于 html 页面不断更新，我需要预览 window 每 0.5 秒反映一次这些变化。

除预览外一切正常 window 刷新时闪烁。这种情况只是偶尔发生，而且看起来很有脾气。大部分时间都不会闪烁，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

500 毫秒对于服务器来说不算多
不建议将setInterval与Ajax
你标记了这个 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();
});

使用 XMLHttpRequest 在网页中查看网页

Viewing a webpage in a webpage using XMLHttpRequest

html

javascript

ajax

jquery

xmlhttprequest