`
ychw365
  • 浏览: 54388 次
  • 性别: Icon_minigender_1
  • 来自: 长春
最近访客 更多访客>>
社区版块
存档分类
最新评论

window.onload函数用法

阅读更多

平时做项目 经常需要使用window.onload,

但window.onload 不能同时加载多个函数。
比如;
Java代码 复制代码
  1. function t(){   
  2.   alert("t")   
  3. }   
  4. function b(){   
  5.   alert("b")   
  6. }   
  7. window.onload =t ;   
  8. window.onload =b ;  
function t(){
  alert("t")
}
function b(){
  alert("b")
}
window.onload =t ;
window.onload =b ;


后面会把前面的覆盖。
上面代码只会输出 b ;

解决方法:
程序代码
Java代码 复制代码
  1. window.onload =function() { t();  b(); }  
window.onload =function() { t();  b(); }


今天看书的时候学了一个函数,分享给大家:

程序代码
Java代码 复制代码
  1.     function addLoadEvent(func) {   
  2.   var oldonload = window.onload;   
  3.   if (typeof window.onload != 'function') {   
  4.     window.onload = func;   
  5.   } else {     
  6.     window.onload = function() {   
  7.       oldonload();   
  8.       func();   
  9.     }   
  10.   }   
  11. }  
    function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {  
    window.onload = function() {
      oldonload();
      func();
    }
  }
}


具体用法;

程序代码
Java代码 复制代码
  1. function t(){   
  2. alert("t")   
  3. }   
  4. function b(){   
  5. alert("b")   
  6. }   
  7. function c(){   
  8. alert("c")   
  9. }   
  10.   
  11.     function addLoadEvent(func) {   
  12.   var oldonload = window.onload;   
  13.   if (typeof window.onload != 'function') {   
  14.     window.onload = func;   
  15.   } else {     
  16.     window.onload = function() {   
  17.       oldonload();   
  18.       func();   
  19.     }   
  20.   }   
  21. }   
  22.   
  23.   
  24. addLoadEvent(t);   
  25. addLoadEvent(b);   
  26. addLoadEvent(c);  
function t(){
alert("t")
}
function b(){
alert("b")
}
function c(){
alert("c")
}

    function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {  
    window.onload = function() {
      oldonload();
      func();
    }
  }
}


addLoadEvent(t);
addLoadEvent(b);
addLoadEvent(c);


//等价于  window.onload =function() { t();  b(); c() ;}
分享到:
评论
1 楼 select*from爱 2010-07-05  
引用

今天看书的时候学了一个函数,分享给大家:

请问lz,你看的是哪本书,能否告诉下
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    ie中 body onload 和 window onload 解决法案

    使用方法如下: ```javascript window.onload = function() { // 代码放在这里 }; // 或者使用现代的事件处理程序添加方式 window.addEventListener('load', function() { // 代码放在这里 }); ``` 这两个事件...

    window.onload

    ### window.onload 与 insertAfter() 方法详解 #### 一、概述 在网页开发过程中,`window.onload` 和 `insertAfter()` 方法是两个非常实用且重要的技术点。它们可以帮助开发者更好地控制页面加载流程以及动态地...

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

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

    window.open全攻略

    在JavaScript中,`window.open()` 是一个非常重要的方法,它用于打开一个新的浏览器窗口或者重载已有的窗口。以下是对这个方法的详细介绍: ### 1. 基本用法 最简单的`window.open()` 使用方式如下: ```...

    window.open参数详解.txt

    本文将深入解析`window.open()`函数的各个参数及其用法。 #### 函数基本结构 `window.open`函数的基本调用格式如下: ```javascript window.open(url, name, features); ``` 其中: - `url`:(必需)一个字符串...

    JavaScript中Window.open参数

    - `function openwin() {...}`: 定义了一个名为 `openwin` 的函数,函数内部调用了 `window.open` 方法。 - `<body onload="openwin()">`: 当页面加载完成后自动调用 `openwin` 函数。 此外,还有其他几种调用方法...

    window.open的参数详细应用

    #### 示例 2: 使用函数自动打开窗口 ```html function openwin() { window.open("page.html", "newwindow", "height=100,width=400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no"); ...

    把多个JavaScript函数绑定到onload事件处理函数上的方法

    在JavaScript编程中,确保函数在页面完全加载之后执行是非常常见的需求,这通常通过将函数绑定到`window.onload`事件来实现。当`window.onload`事件触发时,绑定的函数会被调用,以此来确保所有资源(如图片、脚本等...

    jQuery(document).ready(function($) { });的几种表示方法

    然而,`window.onload`只能绑定一个函数,如果多次使用会覆盖之前的函数。 **第五种:jQuery的`$(document).ready()`与`window.onload()`的区别** - `$(document).ready()`在DOM元素加载完毕后立即执行,不需要等待...

    JavaScript中window.open用法实例详解

    下面我们将详细探讨`window.open()`的使用方法及其相关参数。 `window.open()`的基本语法如下: ```javascript window.open(url, name, features); ``` - `url`:这是一个必需的参数,表示要打开的网页URL。 - `...

    js之onload事件的一点使用心得

    推荐使用匿名函数的方式来绑定onload事件,即window.onload=function(){...}的形式。同时,我们也应该了解DOMContentLoaded事件,它提供了更早的时机来执行必要的代码,尤其是在需要与用户交互的场景中,这一点尤为...

    莱鸟介绍window.print()方法

    `window.print()` 方法是JavaScript中的一个内置函数,主要用于调用浏览器的打印功能。这个方法允许开发者无须离开网页或应用即可让用户打印网页内容,非常适合于那些需要提供打印选项的网站。在本文中,我们将深入...

    判断[removed]是否多次使用的方法

    这样,即使之前已经有一个 `window.onload` 函数,我们也可以保存它,并在新的 `window.onload` 函数中调用它,同时添加我们自己的回调函数 `onloadCallback`。 具体步骤如下: 1. 定义 `onloadCallback` 函数,这...

    网页中JS函数自动执行常用三种方法_.docx

    另一种方法是使用 `window.onload` 事件来自动执行 JS 函数。例如: ```javascript function myfun() { alert("this window.onload"); } window.onload = myfun; //不要括号 ``` 这种方法可以在页面加载完成后...

    一张表格告诉你windows.onload()与$(document).ready()的区别

    在JavaScript和jQuery中,`window.onload()` 和 `$(document).ready()` 都是用于处理页面加载事件的关键函数,但它们的执行时机和用法存在显著差异。了解这些区别对于优化前端性能和确保代码正确执行至关重要。 1. ...

    [removed]追加函数使用示例

    这种追加函数的方法在实际开发中非常实用,尤其在需要添加多个页面加载后执行的脚本时,可以避免对原有`onload`事件处理函数的影响,保证所有必要的操作都能被执行。同时,这也是一种符合开放封闭原则的设计,使得...

    Jquery 在页面加载后执行的几种方式

    需要注意的是,jQuery的`$(document).ready()`方法可以多次使用,而且它和原生的`window.onload`并不冲突。如果两者都使用,则`window.onload`会在`$(document).ready()`之后执行。`window.onload`通常用于在页面...

    javascript页面加载完执行事件代码

    2. 优先考虑使用window.onload或document.addEventListener('DOMContentLoaded', function() {...})方法,而不是document.onreadystatechange,除非需要根据页面加载状态的细微变化进行处理。 3. 如果页面中有多个...

Global site tag (gtag.js) - Google Analytics