在一个页面中有两个JavaScript 分别都用到了window.onload

一个是:window.onload=func1,另一个是:window.onload=func2 这样就造成了一个JavaScript 运行不了。

方案一:

window.onload=function(){func1();func2();}

方案二:

用window.attachEvent和 window.addEventListener来解决问题了

window.addEventListener("load",调用函数名,false);//对于FireFox
window.attachEvent("onload",调用函数名)//对于IE

方案三

function addLoadEvent(func){
var oldonload = window.onload; //把现在有window.onload事件处理函数的值存入变量oldonload。
if(typeof window.onload != 'function'){ //如果这个处理函数还没有绑定任何函数,就像平时那样把新函数添加给它
window.onload = func;
}else{ //如果在这个处理函数上已经绑定了一些函数。就把新函数追加到现有指令的末尾
window.onload = function(){
oldonload();
func();
}
} }
addLoadEvent(num1);
addLoadEvent(num2);

如果有人接下来的js写了一个加载事件:

window.onload = function(){ console.log('最后再来个页面加载函数')} 

结果妥妥的被覆盖了,只会执行最后一个window.load的内容,因此方案三不可取

推荐使用现代浏览器事件绑定 方案二。

原生js中如果有多个onload事件解决方案的更多相关文章

  1. 原生JS中apply()方法的一个值得注意的用法

    今天在学习vue.js的render时,遇到需要重复构造多个同类型对象的问题,在这里发现原生JS中apply()方法的一个特殊的用法: var ary = Array.apply(null, { &q ...

  2. 原生js中slice()方法和splice()区别

    slice()方法和splice()方法都是原生js中对数组操作的方法. slice(),返回一个新的数组,该方法可从已有的数组中返回选定的元素.例如:arrObject(start,end),sta ...

  3. ThinkPHP 中使用 IS_AJAX 判断原生 JS 中的 Ajax 出现问题

    问题: 在 ThinkPHP 中使用原生 js 发起 Ajax 请求的时候.在控制器无法使用 IS_AJAX 进行判断.而使用 jQuery 中的 ajax 是没有问题的. 在ThinkPHP中.有一 ...

  4. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

  5. 关于原生js中函数的三种角色和jQuery源码解析

    原生js中的函数有三种角色: 分两大种: 1.函数(最主要的角色)2.普通对象(辅助角色):函数也可以像对象一样设置属于本身的私有属性和方法,这些东西和实例或者私有变量没有关系两种角色直接没有必然的关 ...

  6. koa 基础(十七)原生 JS 中的类、静态方法、继承

    1.app.js /** * 原生 JS 中的类.静态方法.继承 * es5中的类和静态方法 */ function Person(name, age) { // 构造函数里面的方法和属性 this. ...

  7. 【面试篇】寒冬求职季之你必须要懂的原生JS(中)

    互联网寒冬之际,各大公司都缩减了HC,甚至是采取了“裁员”措施,在这样的大环境之下,想要获得一份更好的工作,必然需要付出更多的努力. 一年前,也许你搞清楚闭包,this,原型链,就能获得认可.但是现在 ...

  8. 原生js中stopPropagation,preventDefault,return false的区别

    1.stopPropagation:阻止事件的冒泡,但不阻止事件的默认行为. 最好莫过于用例子说明: <div id='div'  onclick='alert("div") ...

  9. 原生js中获取this与鼠标对象以及vue中默认的鼠标对象参数

    1.通过原生js获取this对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

随机推荐

  1. onethink多图上传

    模板处理, 可以参考 checkbox 的. 注:edit 方法的 基本一样,需要先把已有的数据展示出来,绑定双击事件,删除图片 需要先绑定给已经展示出来的图片, uploadPicture 的cal ...

  2. windows是下安装nvmw

    nvmw:Windows环境下的node多版本管理工具. 安装: 1.  git clone https://github.com/hakobera/nvmw.git 2.修改环境变量 计算机 -&g ...

  3. 如何用最快的速度读出大小为10G的文件的行数?弄懂 python 的迭代器

    with open('rm_keys.txt', 'r', encoding = 'utf-8') as f: count = 0 for line in f: 7 count += 1 print( ...

  4. 安装flask_mysqldb出现报错问题解析

    安装 mysqldb (pip3 install Flask-MySQLdb)报错 EnvironmentError: mysql_config not found ERROR: Command er ...

  5. 【机器学习】sigmoid函数求导 手写过程

  6. axios二次封装的几种方法

    一.用Class方法 import axios from "axios"; declare var Promise: any; export class Request { sta ...

  7. CQRS1

    CQRS之旅——旅程1(我们的领域:Contoso会议管理系统)   旅程1:我们的领域:Contoso会议管理系统 起点:我们从哪里来,我们带来了什么,谁将与我们同行?“ 只要前进,我愿意去任何地方 ...

  8. PHP新特性

    1.太空船操作符<=> 2.变量类型限定 3.$a = $b??$c 4.常量数组,define($arr,['a','b']) 5.namespace批量导入 等等

  9. 2019牛客多校赛第一场 补题 I题

    I题  Points Division 题意: 给你n个点,每个点有坐标(xi,yi)和属性(ai,bi),将点集划分为两个集合, 任意 A 集合的点 i 和 B 集合点 j, 不允许 xi > ...

  10. 【jmeter测试范例】001——TCP测试

    1.打开Jmeter(或者运行NewDriver.java启动Jmeter) 2.新建一个测试计划 ······ 3.新建线程组 4.设置线程组的参数 1.线程的数量 2.要在多久内完成,即每个请求发 ...