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

<div class="box" onClick="window.open('interest/cloud.php');">

<div class="texts">

<div class="title">云</div>

</div>

<div class="images">

<img src="angel.gif" />

</div>

<div class="texts">

<div class="content">云</div>

<div class="author">云</div>

</div>

</div>

总之就是当鼠标点击除了图片以外的区域触发跳转事件,而点击图片的时候则执行我的其他事件。
------解决思路----------------------



<div class="box" onClick="window.open('interest/cloud.php');">

<div class="texts">

<div class="title">云</div>

</div>

<div class="images" onClick="event.cancelBubble = true">

<img src="angel.gif" />

</div>

<div class="texts">

<div class="content">云</div>

<div class="author">云</div>

</div>

</div>

****注意
onClick="event.cancelBubble = true", 这句代码要加在点击框的父级上

嵌套div的onClick事件问题的更多相关文章

  1. div的onclick事件怎么失效了?

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

  2. ie7中ul不能嵌套div和li平级

    我要讲一个忧伤的故事,本以为清晰的层次结构,ul里不能嵌套div和li平级,不然会乱乱乱! 代码: <ul class="catshow">              ...

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

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

  4. JS里的onclick事件

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

  5. JS监听div的resize事件

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

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

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

  7. onclick 事件

    onclick 事件 Event 对象 定义和用法 onclick 事件会在对象被点击时发生. 请注意, onclick 与 onmousedown 不同.单击事件是在同一元素上发生了鼠标按下事件之后 ...

  8. js 中onclick 事件 点击后指向自己的对象,查找或者添加属性 用关键字this 传入参数 (可以改变原标签css)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. 【winform】基于UserControl实现webBrower组件时html页面元素加载及onclick事件监听实现

    [背景]基于System.Windows.Forms.UserControl实现的webBrower组件在html内使用window.external调用winform事件失败. [解决思路]借助wi ...

随机推荐

  1. 理解Spring:AOP的原理及手动实现

    引入 到目前为止,我们已经完成了简易的IOC和DI的功能,虽然相比如Spring来说肯定是非常简陋的,但是毕竟我们是为了理解原理的,也没必要一定要做一个和Spring一样的东西.到了现在并不能让我们松 ...

  2. 「模拟8.13」任(liu_runda的神题,性质分析)

    考场时没有发现性质,用了个前缀和优化暴力,结果写WA了 我们发现其实联通块的个数就是点的个数-边的个数 然后我们需要维护横向上和纵向上的边的前缀和 前缀和的查询形式稍改一下 暴力 1 #include ...

  3. 磁盘文件监控(Java)并发送邮件通知、系统定期执行的办法

    以下是通过xml文件进行的监控路径.文件以及邮件信息的配置,读取xml文件使用的是三方jar包:dom4j 收发邮件采用的是最普通的javamail,需要两个jar包,mail.jar和activit ...

  4. golang中的defer和return的执行顺序

    结论 go中是先给return准备返回值,再根据defer先进后出的规则执行,最后将返回值返回给调用者 测试用例1验证分析 代码片段如下: func foo_1() (err error) { def ...

  5. Docker(39)- docker 实战二之安装 Tomcat

    背景 参考了狂神老师的 Docker 教程,非常棒! https://www.bilibili.com/video/BV1og4y1q7M4?p=15 直接运行容器 本地找不到镜像会自动下载 --rm ...

  6. react 中的PropTypes与DefaultProps

    每个组件都有自己的props参数,这参数是从父组件接收的一些属性.那我们应该如何对参数的类型做校验,如何定义参数的默认值呢? 1.使用PropTypes校验父组件传过来的参数是否合法 import P ...

  7. Unity 异步加载 进度条

    当我们进行游戏开发时,时常会进行场景切换,如果下个场景较大,切换时就会出现卡顿现象,甚至看起来像是"死机",非常影响用户体验,我们这时就可以运用异步加载,在界面上显示加载的进度条以 ...

  8. 24、Keepalived高可用介绍

    24.1.什么是keepalived: Keepalived 软件起初是专为 LVS 负载均衡软件设计的,用来管理并监控 LVS 集群系统中各个服务节点的状态,后来又加入了可以实现高可用的 VRRP ...

  9. layui table 列宽百分比显示

    var layer = layui.layer, form = layui.form, table = layui.table; var $ = layui.$; /*select gysmc,zyz ...

  10. Docker搭建Gogs代码仓库——代码自动化运维部署平台(一)

    一.准备工作 1.Gogs 概念: Gogs 是一款极易搭建的自助 Git 服务. 目的: Gogs 的目标是打造一个最简单.最快速和最轻松的方式搭建自助 Git 服务.使用 Go 语言开发使得 Go ...