div的onclick事件怎么失效了？

最新推荐文章于 2023-07-09 21:06:34 发布

weixin_30267785

最新推荐文章于 2023-07-09 21:06:34 发布

阅读量2.4k

点赞数 1

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/fanbi/p/10417113.html

版权

1 前言

div是用拼接复制到另一个个div上，div的onclick事件中方法名为close，导致οnclick=“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" οnclick="close2()">
	关闭展示区2（div非拼接,（οnclick=close2()))
</div>

<div id="area" style="background-color: red">展示区在此</div>

</body>
</html>
<script type="text/javascript">
	var html = `<div  cursor: pointer; οnclick='close()'>点击关闭展示区（οnclick=close()）</div>`

document.querySelector('#close').innerHTML = html;

var html = `<div οnclick='close2()'>点击关闭展示区（οnclick=close2()）</div>`

document.querySelector('#close1').innerHTML = html;

var html = `<div οnclick='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事件请求帮助　

转载于:https://www.cnblogs.com/fanbi/p/10417113.html

weixin_30267785

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
div的onclick事件怎么失效了？

1 前言div是用拼接复制到另一个个div上，div的onclick事件中方法名为close，导致onclick=“close()” 触发不了，然后换了名称就可以了2 代码<!DOCTYPE html><html><head> <title>test</title></head>&...
复制链接

扫一扫