问题:写了一个最简单的页面。在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. linux开机挂载磁盘

    1. [root@localhost master-build]# cat /etc/fstab # # /etc/fstab # Created by anaconda on Thu Aug :: ...

  2. 性能测试工具Jmeter08-Jmeter断言(检查点)

    断言是在请求的返回层面增加一层判断机制.因为请求成功了,并不代表结果一定正确,因此需要检测机制提高测试准确性. 下面介绍常用的jmeter三种断言 1.响应断言 例如: 模式匹配规则 2.Size A ...

  3. 分布式任务框架elastic-job 学习笔记

    官方资料:https://github.com/dangdangdotcom/elastic-job ------------------------------------------------- ...

  4. Windows窗体应用开发2--窗体和控件

    1.Windows窗体应用程序的各种组件 2.windows窗体控件的主要类别和功能 3.Windows窗体应用程序处理事件的方法 4.添加并配置Windows窗体和控件 5.创建时间处理程序并监视程 ...

  5. idea安装激活

    安装激活链接: https://blog.csdn.net/newabcc/article/details/80601933 激活出错链接:(key is invalid 失效) https://bl ...

  6. windows常用命令行总结

    cmd下的命令行 1.查看当前目录下的子目录 dir   或 dir /b 类似Linux 下的  ls 或者 ls -l 2.盘符切换  d: 3.进入目录 cd [目录名] 退一个目录 cd .. ...

  7. SSM环境下配置log4j输出sql和异常到控制台和本地日志文件中

    1.引入日志依赖包 <!--解决Spring使用slf4j输出日志与log4j冲突的问题--> <dependency> <groupId>org.slf4j< ...

  8. CAD鼠标移动到对象时显示对象内容

    //定义事件         Editor ed = doc.Editor;         ed.PointMonitor += new PointMonitorEventHandler(ed_Po ...

  9. Android中快速实现自定义字体!

    前言:我们都知道,Android中默认的字体是黑体,而大多数app也都是使用的这种字体,但我们发现,大多数app中,个别地方字体非常好看,例如app的标题栏,菜单栏等地方,那他们是怎么做到的呢?有两种 ...

  10. Android 6.0 动态权限申请

    1. 概述 Android 6.0 (API 23) 之前应用的权限在安装时全部授予,运行时应用不再需要询问用户.在 Android 6.0 或更高版本对权限进行了分类,对某些涉及到用户隐私的权限可在 ...