如何实现在页面上所有内容加载完之前一直显示loading...页面？

Question

比如页面上有一些图片，有不少js脚本。
希望实现的效果，打开连接的时候，一直显示loading...页面，然后全部加载完之后 再整个显示页面，若在规定时间内没有加载出来提示加载失败 点击重新加载

Answer 1

要不你最外层加个div，第一个加载他，让它浮在最上面，都加载完，再删掉

Answer 2

在点击事件执行以后就执行一个loading事件，ajax请求success以后再把loading事件阻止。
function click(){

$(".load").show();

$.ajax({

  type:'post',
  url:url,
  success:function(){
    $('.load').hide()
  }
    })

}

Answer 3

不知道你的jquery版本是多少，你可以到jquery官网查一下 ajax的api文档，$.ajax请求中有一个beforeSend方法，用于在向服务器发送请求前执行一些动作。仅供参考！
jquery ajax

$.ajax({
    type: "post",
    timeout : 60000, //自定义超时时间
    contentType: "application/json",
    url: "/Home/GetList",
    beforeSend: function () {
        $("loading").show();
    },
    success: function (data) {
        if (data == "Success") {
            // ...
        }
    },
    complete: function () {
        $("loading").hide();
    },
    error: function (data) {
        console.info("error: " + data.responseText);
    }
});

Answer 4

body的下面加个loading的代码，head部分加上loading的样式，这样html和css加载完的时候就可以显示loading了，然后js监听onload或者oncontenntready事件，删除loading的html。

Answer 5

在文档上优先+load样式、页面优先加载、等其他元素都加载完成就删除