window.onload 多个事件

最新推荐文章于 2021-11-26 20:21:26 发布
原创 最新推荐文章于 2021-11-26 20:21:26 发布 · 735 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#function #js #attachEvent #addEventListner #onload

本文介绍了一种在不同文件中绑定相同窗口事件时避免函数覆盖的方法。通过使用条件语句判断浏览器类型，并根据不同类型的浏览器采用相应的事件绑定方式，从而有效防止了函数被意外覆盖。

有时候我们会遇到要在window的事件上绑定函数，但是可能是在多个文件中写的。就会出现函数绑定覆盖的情况。解决方案如下：

if(window.addEventListener){
    window.addEventListener("load",functionName,false);
}else if(window.attachEvent){
    window.attachEvent("onload",functionName);
}





这样问题就解决了。




                

        

    



  



    



                



	

		

			

				
					
window.onload和DOMContentLoaded的区别

				
			

			

				

					skysys的研究小屋
				

				

					08-13
					
					3261
					
				

			

		

		

			
				
一、何时触发这两个事件？
1、当 onload 事件触发时，页面上所有的DOM，样式表，脚本，图片，flash都已经加载完成了。
2、当 DOMContentLoaded 事件触发时，仅当DOM加载完成，不包括样式表，图片，flash。
二、为什么要区分？
开发中我们经常需要给一些元素的事件绑定处理函数。但问题是，如果那个元素还没有加载到页面上，但是绑定事件已经执行完了，是没有效果的。这两个事件大致就是用来避免这样一种情况，将绑定的函数放在这两个事件的回调中，保证能在页面的某些元素加载完毕之后再绑定事件的函

			
		

	



                

            
              



	

		

			

				
					
解决window.onload延迟加载问题

				
			

			

				

					weixin_30432179的博客
				

				

					06-23
					
					745
					
				

			

		

		

			
				
window.onload方法，表示当页面所有的元素都加载完毕，并且所有要请求的资源也加载完毕才触发执行function这个匿名函数里边的具体内容。这样肯定保证了代码在domReady之后执行。使用window.onload方法在文档外部资源不多的情况下不会有什么问题，但是当页面中有大量远程图片或要请求的远程资源时，我们需要让js在点击每张图片时，进行相应的操作，如果此时外部资源还没有加载完毕，点...

			
		

	



              


  
              

                


	

		

			

				
					
window.onload绑定多个事件 —— 两种解决方案

				
			

			

				

					kodmoqn的博客
				

				

					08-21
					
					239
					
				

			

		

		

			
				
window.onload绑定多个事件 —— 两种解决方案

			
		

	





	

		

			

				
					
多个事件绑定执行window.onload写法

				
			

			

				

					bafan7124的博客
				

				

					06-27
					
					173
					
				

			

		

		

			
				
多个页面需要绑定多个事件，执行window.onload时，一定要注意正确的写法：
1.创建匿名函数：
window.onload=function(){
 func1();
 func2();
}
2.事件监听：
function addLoadEvent(func){    var oldonload=window.onload; ...

			
		

	



		

			
		



	

		

			

				
					
JavaScript学习（三）：window.onload事件

				
			

			

				

					Andrew_Lii的博客
				

				

					01-01
					
					639
					
				

			

		

		

			
				
window.onloadwindow.onload事件主要用来解决JavaScript脚本在运行时获取不到对象的问题。

			
		

	





	

		

			

				
					
多个window onload的解决办法

				
			

			

				

					MrFano的博客
				

				

					01-25
					
					2115
					
				

			

		

		

			
				
 

同一个页面有很多函数要用到window.onload,但又互相冲突，怎么解决呢，下面是看到的一个函数，和大家分享一下。


function addLoadEvent(func){   // 多个window.onload共用的封装函数
    var oldonload=window.onload; 
    if(typeof window.onload!='function'){ 
 ...

			
		

	





	

		

			

				
					
执行多个window.onload匿名函数的方法

				
			

			

				

					weixin_45190226的博客
				

				

					11-26
					
					1176
					
				

			

		

		

			
				
业务需求：在body里面创建一个div元素，点击div元素能够复制div节点，将复制后的div加载到原有的div节点后面，并且重新设置克隆后的div节点的样式。
JS代码特点：在JS语句中有两个window.onload匿名函数
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>执行多个window.onload匿名函数</title&g

			
		

	





	

		

			

				
					
window.addEventListener来解决让一个js事件执行多个函数

				
			

			

				

					10-27
				

			

		

		

			
				
当需要一个事件触发时执行多个函数，单纯地使用`window.onload`或元素的`onclick`等事件处理方式可能会遇到问题，特别是在需要同时处理多个事件处理器时。这时，`window.attachEvent`和`window.addEventListener`就...

			
		

	





	

		

			

				
					
【JS】如何同时处理多个window.onload事件

				
			

			

				

					weknow
				

				

					09-02
					
					2214
					
				

			

		

		

			
				
如何同时处理多个window.onload事件

			
		

	





	

		

			

				
					
window的onload事件的用法

					
热门推荐

				
			

			

				

					weixin_43046240的博客
				

				

					09-13
					
					7万+
					
				

			

		

		

			
				
1.最简单的用法



注：奇葩，我没用过 
2.在JS语句调用（正确使用姿势）

 
       或使用jquery 
     
onload 事件会在页面或图像加载完成后立即发生。 
3.window.onload()的加载问题 
    由于HTML加载时由上往下的，在HTML加载的时候，遇到function关键字，声明一个函数的时候，就会在内存中开辟一个新的空间来对函数进行存储，方便以...

			
		

	





	

		

			

				
					
window onload 与 img onload事件

				
			

			

				

					小酷陪你玩安卓
				

				

					05-14
					
					3524
					
				

			

		

		

			
				
window onload 与 img onload事件
通常，window.onload就是加载完dom之后执行的。而img就是加载完图片完执行它的onload事件，根据img的src是否加载完成。


因此，看下面代码：
 
 
 
 
img onload事件绑定（错误用法） 
 
window.onload = function(){ 
	var img = document.g

			
		

	





	

		

			

				
					
Window.onload事件

				
			

			

				

					weixin_33670713的博客
				

				

					08-10
					
					164
					
				

			

		

		

			
				
window.onload是一个事件，当文档加载完成之后就会触发该事件，可以为此事件注册事件处理函数，并将要执行的脚本代码放在事件处理函数中，于是就可以避免获取不到对象的情况
转载于:https://www.cnblogs.com/linyusong/p/5755601.html...

			
		

	





	

		

			

				
					
onload

				
			

			

				

					dxm809的博客
				

				

					03-15
					
					1416
					
				

			

		

		

			
				
注意，在onload里面为事件指定函数名称时候不可以加括号


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			#dv{
				width: 100px;
				height: 1...

			
		

	





	

		

			

				
					
onload问题

				
			

			

				

					的博客
				

				

					03-21
					
					711
					
				

			

		

		

			
				
sol = function (f) { if (__onLoadHandler__ == undefined) {  _global.__onLoadHandler__ = {}; } __onLoadHandler__[this] = f;};gol = function () { return __onLoadHandler__[this];};MovieClip.prototype.add

			
		

	





	

		

			

				
					
js onload

				
			

			

				

					chunxing8238的博客
				

				

					02-27
					
					438
					
				

			

		

		

			
				
onload 和 onunload 事件onload 和 onunload 事件会在用户进入或离开页面时被触发。onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。onload 和 onunload 事件可用于处理 cookie。实例&lt;body onload="checkCookies()"&gt;...

			
		

	





	

		

			

				
					
JavaScript中OnLoad用法

				
			

			

				

					weixin_34236869的博客
				

				

					02-26
					
					229
					
				

			

		

		

			
				
在前几个项目的开发中 遇到onload使用的几种情形
1. 可以在Body 里面执行
   &lt;body onload="alert(123)"&gt;&lt;/body&gt;
2. 先定义好 在页面加载完成后 使用
   &lt;script type="text/javascript"&gt;        function test(){    var aa = "嘻嘻,你个大...

			
		

	





	

		

			

				
					
onload事件

				
			

			

				

					起风了
				

				

					08-03
					
					1000
					
				

			

		

		

			
				
触发时间与条件：页面加载（文本和图片）完毕的时候。使用原因：js的加载时和html同步加载的。（如果使用元素在定义元素之间，容易报错。）用途：window.onload可以预防使用标签在定义标签之前。    window.onload = function () {
        var aaa = document.getElementById("box");
        console.l

			
		

	





	

		

			

				
					
window.onload事件和window.afterload事件的区别

				
			

			

				

					07-14
				

			

		

		

			
				
 - 如果在页面中存在多个绑定给 window.onload 的函数，只有最后一个函数会被执行。  - 如果在页面中存在多个绑定给 DOMContentLoaded 的函数，它们会按顺序依次执行。  总结来说，window.onload 事件在整个页面及其...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值