网页开发中使用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)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...
随机推荐
- Tailwind CSS:最受欢迎的实用类CSS框架!Github Star达到了惊人的82.5K!
在前端开发的世界中,随着项目的复杂性增加,如何高效管理样式,快速开发出响应式.美观的界面成为每个开发者关心的问题.Tailwind CSS 作为一个革命性的实用类(utility-first)CSS ...
- API和SDK的区别
API 和 SDK 有以下区别: 定义与功能: API(应用程序编程接口):是一组定义了软件组件之间交互规范的接口,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而无需访问源码或 ...
- MaskGCT,AI语音克隆大模型本地部署(Windows11),基于Python3.11,TTS,文字转语音
前几天,又一款非自回归的文字转语音的AI模型:MaskGCT,开放了源码,和同样非自回归的F5-TTS模型一样,MaskGCT模型也是基于10万小时数据集Emilia训练而来的,精通中英日韩法德6种语 ...
- PhpStorm 2024.2.4 最新安装教程(附2099年~亲测有效)
下载安装 下载补丁https://pan.quark.cn/s/fcc23ab8cadf 检查 免责声明:本文中的资源均来自互联网,仅供个人学习和交流使用,严禁用于商业行为,下载后请在24小时内从电脑 ...
- UE4纯C++实现游戏快捷栏之将快捷栏注册到玩家状态
我们有了UI有了物品信息,接下来我们便需要给每一个玩家绑定一个快捷栏了,我们分以下几部分来注册我们玩家的快捷栏. 1.Types.h:定于ShortcutContainer类,定义快捷栏的单个容器结构 ...
- 算法笔记——马拉核弹(Mana Nuclear)
0x00 摘要 "马拉核弹"算法由 SXHT 同学(2009~今)发明,并在 2024 年 11 月于某不知名学校机房内正式公布.该算法基于 1975 年发明的 Manacher ...
- dyld: 神秘的 __dso_handle
iOS动态链接器dyld中有一个神秘的变量__dso_handle: // dyld/dyldMain.cpp static const MachOAnalyzer* getDyldMH() { #i ...
- CF1019C Sergey's problem
CF1019C Sergey's problem 很巧妙的构造题. 思路 首先我们可以把这题分成两个部分: 解决覆盖问题 解决边冲突问题 \(vis_i\) 为 \(i\) 点是否被覆盖的标记,\(c ...
- php 异步并行后续--兼容FPM使用的组件
上次给人推荐了这篇文章,关于PHP异步并行的文章,之后有人评论问这个组件能不能给fpm用,我测试了一下发现不行,于是又找到一个可以给fpm用的http请求组件. 安装很简单,就这样 composer ...
- 盘点Vue3 watch的一些关键时刻能够大显身手的功能
前言 watch这个API大家应该都不陌生,在Vue3版本中给watch增加不少有用的功能,比如deep选项支持传入数字.pause.resume.stop方法.once选项.onCleanup函数. ...