网页开发中使用javascript语言时浏览器操作时弹出错误:Uncaught TypeError: Cannot set property 'onClick' of null。
在Chrome浏览器下,遇到了这个错误提示:Uncaught TypeError: Cannot set property 'onClick' of null。
先贴一下JS的代码:
document.getElementById("#register button").onclick=function(){
alert('222');
}
后来查了是因为我的JS文件引入的顺序比标签加载的早,so,把js文件的引入放到了body下,但是依然报错。多处查询后,解决办法如下:
网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式:
一、通过window.onload来执行脚本代码。window.onload是一个事件,当文档加载完成之后就会触发该事件,可以为此事件注册事件处理函数,并将要执行的脚本代码放在事件处理函数中,于是就可以避免获取不到对象的情况。window.οnlοad=function(){},使用此种方式为window.onload事件绑定事件处理函数,这里绑定的是一个匿名函数,当然也可以绑定非匿名函数。
二、可以使用addEventListener()和attachEvent()为onload事件绑定事件处理函数,addEventListener()是当前标准的一种事件处理函数绑定方式,但是IE8和IE8以下的浏览器并不支持此方式(addEventListener("type",函数名,false))。
这时用第一种方法就可以解决问题,如果要处理多个事件的绑定,要用第二种方法。
//方法一:
window.onload = function () {
document.getElementById("register").onclick=function(){
alert('222');
}
}
//方法二:(支持各大浏览器)
if(window.addEventListener){
window.addEventListener("load",alert1,false);
window.addEventListener("load",alert2,false);
}
else{
window.attachEvent("onload",alert1);
window.attachEvent("onload",alert2);
}
function alert1(){
document.getElementById("register").onclick=function () {
alert('测试1');
};
}
function alert2(){
document.getElementById("register").onclick=function () {
alert('测试2);
};
}
参考链接:
1、Uncaught TypeError: Cannot set property 'onClick' of null。
2、Uncaught TypeError: Cannot set property 'onclick' of null onclick not working
3、Uncaught TypeError: Cannot set property 'onclick' of null解决办法
网页开发中使用javascript语言时浏览器操作时弹出错误:Uncaught TypeError: Cannot set property 'onClick' of null。的更多相关文章
- JavaScript中"Uncaught TypeError: Cannot set property 'innerHTML' of null"错误
写了一个函数,在调用时出错:"Uncaught TypeError: Cannot set property 'innerHTML' of null" 代码如下: <!DOC ...
- day01-JavaScript中"Uncaught TypeError: Cannot set property 'innerHTML' of null"错误
转行学开发,代码100天.初写了最简的一段Js代码,即通过document中的innerHTML方法修改一个<p>标签的内容,报以下错误. -"Uncaught TypeErro ...
- JavaScript Uncaught TypeError: Cannot read property 'value' of null
用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...
- 【jQuery学习】用JavaScript写一个输出多选框的个数报错:Cannot set property 'onclick' of null"
说明:代码段来源于:<锋利的jQuery> 根据代码段我补充的代码如下: <!DOCTYPE html> <html> <head> <meta ...
- laydate 日期格式为yyyy 或yyyy-MM时,出现错误Uncaught TypeError: Cannot read property 'length' of undefined
这个改起比较麻烦,没有深究,简单兼容了yyyy 和yyyy-MM,其他格式可能还是会有错误.替换Dates.check方法. //检测日期是否合法 Dates.check = function(){ ...
- 网站开发中使用javascript获取浏览器滚动条宽度
在网站开发中,有时候需要获取浏览器滚动条的宽度,在武汉蚂蹄软件服务中心的技术人员指导之下,我实现了该需求.记录如下: 首先说明一下原理: ①生成一个div,设置滚动条不可见,记录其宽度: ②将上面的d ...
- Android开发中如何解决加载大图片时内存溢出的问题
Android开发中如何解决加载大图片时内存溢出的问题 在Android开发过程中,我们经常会遇到加载的图片过大导致内存溢出的问题,其实类似这样的问题已经屡见不鲜了,下面将一些好的解决方案分享给 ...
- FPGA开发中的脚本语言
多数FPGA开发者都习惯图形化界面(GUI).GUI方式简单易学,为小项目提供了一键式流程.然而,随着FPGA项目越来越复杂,在很多情况下GUI工具就阻碍了工作效率.因为GUI工具不能对整个开发过程提 ...
- WPF 窗体中获取键盘和鼠标无操作时的超时提示
原文:WPF 窗体中获取键盘和鼠标无操作时的超时提示 通过调用Windows API中的GetLastInputInfo来获取最后一次输入的时间 , , ); timer.Tic ...
- 手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法
手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法 最近碰到Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...
随机推荐
- 祝贺开源之夏 2023 KubeSphere 社区项目中选学生!
日前,开源之夏 2023 所有中选结果已出炉,在此祝贺各位中选的同学! 活动简介 开源之夏是由中科院软件所"开源软件供应链点亮计划"发起并长期支持的一项暑期开源活动,旨在鼓励在校学 ...
- 如果让你处理hbase 怎么保证数据的安全性可靠性 不需要具体的设置 要一套方案
有关数据安全及可靠我们认为大体上分为存储安全和使用安全 1 数据存储安全 hbase是基于hdfs的一种数据存储解决方案,所以有关数据的安全性可靠性可以利用hdfs自身的副本机制保障.另外原生的hba ...
- 进程相互作用之信号量PV操作及其代码实现
目录 信号量PV操作 基本介绍 数据结构 解决进程互斥问题 解决进程同步问题 代码实现(以同步问题为例) 信号量PV操作 基本介绍 信号量(Semaphore):是表示资源的实体,是一个与队列有关的整 ...
- MNN框架在WIN10上的部署
一.为什么要做 刚进公司,实习期反正主管要求什么我就做什么....自己反正也比较感兴趣,故开始查看官方文档.下述的一切都是基于官方提供的"语雀文档"内的指令进行的,会对自己部署MN ...
- 国产化UOS适配
配置本地iso镜像为apt源 把镜像放到目录下 /home/gaohongyu/debian/uniontechos-server-20-enterprise-1030-arm64.iso 创建目录 ...
- You Shi Zai Wo
Xuzhou is a place where there have been more than 50 large-scale battles from ancient times to the p ...
- C# Modbus 之 EasyModbus
直接上代码 public int EasyModbusReadInputRegisters() { ModbusClient modbusClient = new ModbusClient(_spHe ...
- .NET +Vue 开发的高级报表工具
前言 本文介绍一款基于 .NET 6 开发的高级报表工具.该工具支持多种数据源(如数据库.Excel 文件.API 服务等),并具备强大的数据处理和可视化功能.通过内置的集合函数和类 Excel 界面 ...
- Tomcat并发数优化的方法总结
web应用的并发提升,除了负载均衡.在小企业中也可以通过一些软件的上的设置来进行一些优化.下面是一些在服务器上修改tomcat参数的优化方法,非常简单实用!(这些方法通过网络整理的) 1,让Tomca ...
- 运维工具之Netdata
[导语]:Netdata 是一个开源.免费.预配置.高灵敏度的分布式实时监控系统. 简介 Netdata的分布式实时监视代理以零配置的方式,从系统.硬件.容器和应用程序收集数千个指标,它可以运行在所有 ...