等待页面准备好后再显示

Wait for a page to be ready before showing it

本文关键字:显示 准备好 等待      更新时间:2023-09-26

我很确定这是不可能的,但我可能错了。我曾被要求暂停一个网页,直到另一个网页准备好,然后再显示后者。

例如,考虑有一个链接到pageB.html的pageA.html。pageB有一些创建页面的jScript(实际上是GWT,但假装你不知道)。

用户希望继续显示pageA,直到pageB准备好显示为止。可以把这两页分开吗?

你可以看看AngularJS。(SPA =单页申请)。您可以在当前页面中加载新视图("页面"),并显示加载器或当前页面,直到加载完成。

您可以使用jQuery $(window).load(function(){});并在现有页面上创建一个覆盖。

。用户加载页面A,你有一个覆盖立即可见阻止页面的可见性。当加载事件被触发时,你可以移除覆盖层。

这与你所要求的略有不同,但可能是一种方法。

JS提琴示例

您可以一直检查url,直到页面存在。这意味着您想要重定向到的页面还不存在,将在某个时候创建。

链接可以是

<a href="javascript:;" onclick="delayRedirectTo('my-generated-page.html');">link text</a>

然后在delayRedirectTo函数中包装一些逻辑。

function delayRedirectTo(path){
    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange=function(){
        // Status will only be 200 when the page exists
        if (xhr.readyState==4 || xhr.status == 200)
        {
            // Redirect to page.
            window.location.href = path;
        }
    }
    window.setInterval(function(){
        xhr.open("GET",path,true);
        xhr.send(); 
    }, 5000); // check every 5 seconds.
}

可以使用Javascript和AJax

JS on pageA.html

<script>
  function loadPageB(){
  var html = document.getElementById("html");
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
   {
     html.innerHTML=xmlhttp.responseText;
   }
  }
xmlhttp.open("GET","pageB.html",true);
xmlhttp.send(); 
} 
</script>

HTML页面

<!-- some code here -->
<input type="button" value="go to PageB" onclick="loadPageB()"/>
<!-- some code here -->

在上面的例子中,点击按钮后,它将加载pageB.html