zoukankan      html  css  js  c++  java
  • js判断页面是否加载完成

    1.javascript、jquery:

    方法一:

    window.onload=function(){

    }

    方法二:

    //判断网页是否加载完成

    document.onreadystatechange=function(){

            if(document.readyState=="complete"){

                    document.getElementById('divpro').style.display='none'

             }

    }

    方法三:

    ;(function($,undefined){

           $(function(){

                    //your code

            });

    })(window,jQuery);

    注:以上的方法只能判断Dom 的加载状态,不能判断图片是否加载成功。如果碰到页面需要图片加载完成才能展现的情况,我们就没法搞定了。先提供两种方法判断图片是否加载完成。

    3.使用onload的图片加载事件检测

    ;(function(){

        var pro=['',''],//存放图片的路径的数组

               i=0,         //从第几张开始加载

               len=pro.length,   //图片的数量

              load=functon(src){

                       if(i<len){

                               var img_obj=new Image;

                                 img_obj.src=src;

                                 img_obj.onload=img_obj.onerror=load(pro[i++]);

                        }else{

                                  //执行之后的代码

                                }

                 };

             load(pro[i]);//开始加载

    })()

    注:这是使用onload和onerror检测判断,但有时候不能检测到图片是否加载完成,在使用过程中,他只能判断图片所有开始加载时就触发了,不过基本上可以满足需求。

    4.使用complete的图片属性检测

    ;(function(){

           var pro=['',''],    //存放图片的数组路径

                 i=0,    //从第几张开始

                 len=pro.length,   //图片的数量

                 timer=null,    //计时器句柄

                  load=function(src){

                             if(i<len){

                                  var img_obj=new Image;

                                  img_obj.src=src;

                                  timer =setInterval(function(){

                                            if(img_obj.complete){

                                                        clearInterval(timer);

                                                         load(pro[i++])

                                               }

                                     },80);

                                }else{

                                           //执行之后的代码

                                        }

                      };

                 load(pro[i]); //开始加载

    })()

    注:这里采用定时器不断检测图片的complete属性,这个比较完美,只有图片加载完成时,才回变成真,所以比较可靠,建议采用。

    参考:https://jingyan.baidu.com/article/63acb44a376f5961fcc17ef0.html

  • 相关阅读:
    Sql日期时间格式转换
    c#被指定为此窗体的 MdiParent 的窗体不是 MdiContainer?
    kmeans聚类分析
    C# VS2005打开没问题,但是运行解决方案时就整个自动关闭了
    PowerDesigner教程系列(一)概念数据模型
    PowerDesigner概念设计模型(CDM)中的3种实体关系
    spss clementine Twostep Cluster(两步聚类 二阶聚类)
    PowerDesigner教程系列(三)概念数据模型
    Kmeans聚类算法
    c# 中窗体居中代码怎么写?
  • 原文地址:https://www.cnblogs.com/liuqingxia/p/7567537.html
Copyright © 2011-2022 走看看