div的onclick事件怎么失效了?
1 前言
div是用拼接复制到另一个个div上,div的onclick事件中方法名为close,导致onclick=“close()” 触发不了,然后换了名称就可以了
2 代码
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body> <div id="open"></div>
<div id="close"></div>
<div id="close1"></div>
<div id="close2" onclick="close2()">
关闭展示区2(div非拼接,(onclick=close2()))
</div> <div id="area" style="background-color: red">展示区在此</div> </body>
</html>
<script type="text/javascript">
var html = `<div cursor: pointer; onclick='close()'>点击关闭展示区(onclick=close())</div>` document.querySelector('#close').innerHTML = html; var html = `<div onclick='close2()'>点击关闭展示区(onclick=close2())</div>` document.querySelector('#close1').innerHTML = html; var html = `<div onclick='show()'>点击打开展示区</div>` document.querySelector('#open').innerHTML = html;
//此方法无法被触发,
function close(){
document.querySelector('#area').style.display='none';
} function close2(){
document.querySelector('#area').style.display='none';
} function show(){
document.querySelector('#area').style.display='block';
} </script>
分析:因为close是window的方法,所以不管拼接出来的还是原先写好的onclick方法都是一样的。
//在console输入
close
ƒ () { [native code] }
3 参考
3.1 用JS添加的DIV,无法触发onclick事件 请求帮助
div的onclick事件怎么失效了?的更多相关文章
- 嵌套div的onClick事件问题
嵌套div的onClick事件问题我在下面的代码中的外层div中加了onClick事件,这样当鼠标点击这个div的时候就会跳转了.但是我在图片上加了一些其他效果,所以当鼠标点击中间的img时不能触发跳 ...
- 解决iscroll5在手机页面上onclick事件失效
Iscroll.js使用之后页面上面A标签的onclick事件无效了 解决办法 实例化IScroll的时候把preventDefault设为false,默认为true var myScroll; ...
- react中使用map时onClick事件失效
分享一些踩过的坑 react中使用map时onClick事件失效 <span> { count.map( (item,index)=>{ return <span style= ...
- select中option的onclick事件失效
html: <select id="pageSelect"> <option value="1" selected onclick=" ...
- 原生andriod浏览器回退后dom(click)事件全体失效问题探究
问题描述 今天同事遇到一个神一样的BUG: 在原生浏览器下,为dom元素绑定一个click事件,其中有个a标签外链,点击a后进入其他页面,点击浏览器后退后,页面点击事件全体失效! 我于是用ios测了下 ...
- 【转】ASP.NET的OnClientClick与OnClick事件【解决了“识别用户在对话框里面选yes或no的问题”】
OnClientClick是客户端事件方法.一般采用JavaScript来进行处理.也就是直接在IE端运行.一点击就运行. OnClick事件是服务器端事件处理方法,在服务器端,也就是IIS中运行.点 ...
- JS里的onclick事件
可以通过以下代码了解JS里的onclick事件: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&quo ...
- JS监听div的resize事件
原文地址:http://zhangyiheng.com/blog/articles/div_resize.html 需求 开发过程中经常遇到的一个问题就是如何监听一个div的size变化. 比如我用c ...
- 【onclick事件】【改变 HTML 内容innerHTML】【图片替换】【改变标签的css】【判断输入是否是数字】
1.onclick事件 <button type="button" onclick="alert('Welcome!')">点击这里</but ...
随机推荐
- mybatis 使用注解简化xml映射文件
目录 关于mybatis注解 初次简单使用mybatis注解示例 利用注解实现指定映射 使用注解实现表间关联(1对1) 关于mybatis注解 注解在java中特别常见,mybatis中也支持注解. ...
- VUE 绑定背景图片的写法
<div v-bind:style='{"background-image":"url("+imgUrl+")"}' >< ...
- json 百分比转化
NumberFormat number = NumberFormat.getPercentInstance(); number.setMaximumFractionDigits(0);//设置小数点后 ...
- 怎么使Richedit中光标始终指到最后一行的最后面?
Richedit中数据会不断增加.要始终能看到当前的数据.该怎么做? SendMessage(Memo->Handle, WM_VSCROLL, SB_BOTTOM, 0); SendMessa ...
- 一个".java"源文件中是否可以包括多个类
可以有多个类,但只能有一个public的类,并且public的类名必须与文件名相一致. 现在我们编个测试文件来测试一番(一个程序员要具有用于探索的精神 -.- 手动滑稽) 1.编写一个 a ...
- windows配置MySQL
mysql安装.启动和基础配置 --windows版本 1.把下载好的zip文件解压到任意目录下,这个目录就是mysql的安装目录. 2.打开目录找到my-default.ini这个配置文件,复制这个 ...
- 清北澡堂 Day 3 上午
1.数论函数的卷积公式 (ƒ*g)(n)=Σd|nƒ(d)×g(n/d) 已知f*[1~n],g[1~n] 怎么求(f*g)[1~n]? 一个个求复杂度O(n根号n) 如何加速? 考虑更换枚举顺序(这 ...
- Mybatis Generator的model生成中文注释,支持oracle和mysql(通过实现CommentGenerator接口的方法来实现)
自己手动实现的前提,对maven项目有基本的了解,在本地成功搭建了maven环境,可以参考我之前的文章:maven环境搭建 项目里新建表时model,mapper以及mapper.xml基本都是用My ...
- 神经网络6_CNN(卷积神经网络)、RNN(循环神经网络)、DNN(深度神经网络)概念区分理解
sklearn实战-乳腺癌细胞数据挖掘(博客主亲自录制视频教程,QQ:231469242) https://study.163.com/course/introduction.htm?courseId ...
- 驱动调试(四)oops确定调用树
目录 驱动调试(四)oops确定调用树 内核开启调用树 栈指针分析 原理 寄存器别名 基础解释 例子分析 找到PC地址的位置 栈分析 附录:原文的excel title: 驱动调试(四)oops确定调 ...