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事件怎么失效了？的更多相关文章

  1. 嵌套div的onClick事件问题

    嵌套div的onClick事件问题我在下面的代码中的外层div中加了onClick事件,这样当鼠标点击这个div的时候就会跳转了.但是我在图片上加了一些其他效果,所以当鼠标点击中间的img时不能触发跳 ...

  2. 解决iscroll5在手机页面上onclick事件失效

    Iscroll.js使用之后页面上面A标签的onclick事件无效了   解决办法 实例化IScroll的时候把preventDefault设为false,默认为true var myScroll; ...

  3. react中使用map时onClick事件失效

    分享一些踩过的坑 react中使用map时onClick事件失效 <span> { count.map( (item,index)=>{ return <span style= ...

  4. select中option的onclick事件失效

    html: <select id="pageSelect"> <option value="1" selected onclick=" ...

  5. 原生andriod浏览器回退后dom（click）事件全体失效问题探究

    问题描述 今天同事遇到一个神一样的BUG: 在原生浏览器下,为dom元素绑定一个click事件,其中有个a标签外链,点击a后进入其他页面,点击浏览器后退后,页面点击事件全体失效! 我于是用ios测了下 ...

  6. 【转】ASP.NET的OnClientClick与OnClick事件【解决了“识别用户在对话框里面选yes或no的问题”】

    OnClientClick是客户端事件方法.一般采用JavaScript来进行处理.也就是直接在IE端运行.一点击就运行. OnClick事件是服务器端事件处理方法,在服务器端,也就是IIS中运行.点 ...

  7. JS里的onclick事件

    可以通过以下代码了解JS里的onclick事件: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&quo ...

  8. JS监听div的resize事件

    原文地址:http://zhangyiheng.com/blog/articles/div_resize.html 需求 开发过程中经常遇到的一个问题就是如何监听一个div的size变化. 比如我用c ...

  9. 【onclick事件】【改变 HTML 内容innerHTML】【图片替换】【改变标签的css】【判断输入是否是数字】

    1.onclick事件 <button type="button" onclick="alert('Welcome!')">点击这里</but ...

随机推荐

  1. Golang 入门 : 切片(slice)

    切片(slice)是 Golang 中一种比较特殊的数据结构,这种数据结构更便于使用和管理数据集合.切片是围绕动态数组的概念构建的,可以按需自动增长和缩小.切片的动态增长是通过内置函数 append( ...

  2. 关于mysql中unique的插入Duplicate key

    MySQL数据库中 如果在后台中不做判断是否unique的column是否存在的话,直接把数据操作给dao层再传给DB的话,就会报重复的唯一值.如果确实是不希望先取出判断unique的column是否 ...

  3. JDBC数据库连接池之dbcp

    一.连接池的作用 数据库的连接是一种很重要的资源,如果一个项目比较小,连接数据库的次数比较少,我们可以采取直连的方式:“获取连接----使用----关闭连接”.但是如果一个网站访问量很大,假如同时有几 ...

  4. koa-session 记录当前会话内容

    最近做毕设需要在nodejs服务器下记录当前用户账号,所用的node框架是koa,所以相对应配套的用了koa-session,发现和之前学的session差不多,都是会话级别的. 一.session和 ...

  5. mysql 基本语句

    求知若渴 虚心若愚   博客园 首页 新随笔 联系 管理 随笔-391  文章-0  评论-7  mysql sql常用语句大全   SQL执行一次INSERT INTO查询,插入多行记录 inser ...

  6. 【XSY3139】预言家 数位DP NFA

    题目描述 有一个定义在 \(\{0,1,2,3,4,5,6,7,8,9\}\) 上的合规表达式,包含三种基本的操作: 结合:\(E_1E_2\) 分配:\((E_1|E_2|\ldots|E_n),n ...

  7. Java【第九篇】异常处理

    异常概述 介绍 任何一种程序设计语言设计的程序在运行时都有可能出现错误,例如除数为0,数组下标越界,要读写的文件不存在等等.捕获错误最理想的是在编译期间,但有的错误只有在运行时才会发生.对于这些错误, ...

  8. golang 笔记

    golang 的坑 package main import ( "fmt" "net/http" "time" ) func Hello(w ...

  9. 【译】1. Java反射——引言

    原文地址:http://tutorials.jenkov.com/java-reflection/index.html *By Jakob Jenkov Java的反射机制使得它可以在运行时检查类.接 ...

  10. 分享4个运维平台工具OSSIM、Ansible的学习思路

    对于当今企业安全来说,真正价值不在于亡羊补牢,也不在于一个或多个高危漏洞.企业在乎的是如何防患于未然,如何快速定位攻击,如何快速解决安全问题.OSSIM作为开源的安全信息管理平台,对于企业的需求来说毋 ...