zoukankan      html  css  js  c++  java
  • js-用判断音乐或图片是否加载完成的方式来控制页面的现实

    判断页面加载,加完完成后,内容页显示,加载条隐藏

    百度搜索方法很多,大多都是:

    document.onreadystatechange = function()   //当页面加载状态改变的时候执行function
    
    { 
    
       if(document.readyState == "complete")
    
      {   //当页面加载状态为完全结束时进入 
                  init();   //你要做的操作。
         }
    } 
    

    上面的方法我测试后是可以这样来操作的,但是页面也会出现:

    document.readyState == "interactive"
    

      

    上面这种情况。好吧我可能想到了。上面的方法是对的。

    但是我还是被安利了一种新的方法

    判断页面中的用的音乐或一张大的图片的加载进度来控制页面的隐藏显示,加载条的隐藏显示

    方法如下:

    var ajax = new XMLHttpRequest();
    ajax.open("get", "http://******/loading.mp3")
    	ajax.responseType = "blob";
    	ajax.send();
    	ajax.onprogress = function(event) {
    	}
    	ajax.onreadystatechange = function() {
    		if(ajax.readyState == 4 && ajax.status == 200) {
    			document.getElementById("audio").src = URL.createObjectURL(ajax.response);
    			document.getElementById('audio').play();  
    			setTimeout(function(){
    		               	document.getElementById('loading').style.display='none';
    		               	document.getElementById("page").style.display='block';
    		        },1000)   
                     }
    	}
    

      

      

     

  • 相关阅读:
    通过crontab命令创建任务
    linux 通过at命令创建任务
    在linux中如何实现定时发送邮件到指定邮箱,监测任务
    python发送邮件
    序列化分析
    文件写入
    导入excel成一个list集合不支持大文件倒入(优化点在于分批分线程导入)
    react重学
    关于java集合排序
    fiddler还是浏览器的问题
  • 原文地址:https://www.cnblogs.com/liuqingxia/p/11327613.html
Copyright © 2011-2022 走看看