问题:写了一个最简单的页面。在script标签中使用的 window.onload = function() { function add() { //... } }

页面上:<div onclick="add()"></div>

但是,函数不仅没有触发,同时控制台报错:add() is not defined.

分析:这里需要两个背景知识:1)HTML页面执行顺序为自上而下;2)window.onload=function() {}会等页面全部加载完毕后再执行。

基于上面两点,当程序执行到window.onload的时候,不会去解析里面的内容。但是,当解析到div标签上的onclick函数的时候,就会去找add()函数,这个时候发现程序里面是没有的,所以就会报错。

解决:这个时候,可以使用obj.onclick = add; 就可以了。

注意:1)obj: 这个是些onclick事件的那个标签的DOM对象;2)add后面不需要加()。如果加了就成了闭包,所以,直接写名字就可以了。这是两个需要注意的细节。

参考:https://www.cnblogs.com/magicgua/p/4363903.html#commentform

感谢@magicgua的分享

JavaScript: window.onload = function() {} 里面的函数不执行的更多相关文章

  1. JavaScript向window onload添加加载函数

    有时候我们需要在页面加载事件后完成一些函数操作,对于函数比较多的情况下可以写一个统一的加载函数 .本函数来自于JavaScript DOM 编程艺术: function addLoadEvent(fu ...

  2. javascript window.onload 加载多个函数的方法

    用法如下: function func(){alert("this is window onload event!");return;} window.onload=func; 或 ...

  3. JavaScript window.onload 事件和 jQuery ready 函数有何不同?

    JavaScript window.onload 事件和 jQuery ready 函数之间的主要区别是,前者除了要等待 DOM 被创建还要等到包括大型图片.音频.视频在内的所有外部资源都完全加载.如 ...

  4. js常见执行方法window.onload = function (){},$(document).ready()

    1. window.onload = function(){}; 当页面DOM对象加载完毕,web浏览器能够运行JS时,此方法即被触发. 2. $(document).ready();当web页面以及 ...

  5. JQUERY的$(function(){})和window.onload=function(){}的区别

    在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){}) 作用类似于传统JavaScript中的window.o ...

  6. JQUERY的$(function(){})和window.onload=function(){}的区别【转】

    在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){}) 作用类似于传统JavaScript中的window.o ...

  7. window.onload 添加多个函数绑定

    window.onload = function(){alert(2)} function addEvent (fun) { var old = window.onload; if(typeof ol ...

  8. 页面加载之window.onload=function(){} 和 $(function(){})的区别

    通用的页面加载js有四种方式: 1.window.onload = function(){}; —-js 2.$(window).load(function(){});——Jquery 3.$(doc ...

  9. jQuery $(document).ready()和JavaScript window.onload()事件的区别

    一. 在网上查了一下,发现$(document).ready()是在DOM树加载完成时触发,而window.onload()则是在整个页面全部加载完成时触发.下面是一些验证. var start=+n ...

随机推荐

  1. Jquery 客户端验证

    Jquery 客户端验证 //引入js文件 validate.js <html> <head> <title>jqueryValidateDemo</titl ...

  2. 修复kindEditor点击加粗, 内容焦点跳动的问题

    大概1560~1569行 pos : function() { var self = this, node = self[0], x = 0, y = 0; if (node) { if (node. ...

  3. Functional language(函数式编程语言)初步了解

    对于函数式语言并不太了解,查询了百度.博客.知乎等做了以下总结. What 函数式语言(functional language)一类程序设计语言,是一种非冯·诺伊曼式的程序设计语言.函数式语言主要成分 ...

  4. 解决jQuery在chrome中获取height为0

    笔者之前在一家创业公司做过项目,当时遇到这么一个奇怪的问题,我需要用一个jQuery的height()方法获取一个div的高度,但是在chrome浏览器上面有时可以正常获取,但是同一个页面刷新多几次获 ...

  5. SAP常用函数

    1.获取月末最后一天日期 DATA LAST_DATE TYPE SY-DATUM. CALL FUNCTION 'LAST_DAY_OF_MONTHS' EXPORTING day_in = sy- ...

  6. HUE安装与使用

    HUE安装与使用 1.介绍 HUE是一个开源的Apache Hadoop UI系统,早期由Cloudera开发,后来贡献给开源社区.它是基于Python Web框架Django实现的.通过使用Hue我 ...

  7. PDO数据库类——对query()和exec()的异常监听

    PDO异常类中,query()和exec()方法中执行失败时,默认情况下,我们是无法知道,具体执行失败的原因. 那如果我们想要监听异常的话,肿么整呢? 只要使用setAttribute()方法,即可监 ...

  8. 计算后缀表达式的过程(C#)

    计算后缀表达式的过程是一个很好玩的过程,而且很简单哦!这里呢,有个计算的技巧,就是:遇到数字直接入栈,遇到运算符就计算! 后缀表达式也叫逆波兰表达式,求值过程可以用到栈来辅助存储: 假定待求值的后缀表 ...

  9. To my dear friends in SFAE

    To my dear friends in SFAE, 这不是farewell,我还在西门子大家庭.2018年1月份我会转到SLC MCBU.在SFAE十年,一些敢想,唠叨唠叨~ 十年弹指一挥间.记得 ...

  10. Docker和宿主机操作系统文件目录互相隔离的实现原理

    我们知道在Docker容器里是无法访问到宿主操作系统的文件目录的,但这种隔离是怎么实现的呢? 其实一点也不神奇--利用了Linux系统的内部命令chroot. chroot能将进程的根目录设置成任意指 ...