嵌套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. JVM调优的反思与总结

    垃圾回收的悖论 所谓"成也萧何败萧何".Java的垃圾回收确实带来了很多好处,为开发带来了便利.但是在一些高性能.高并发的情况下,垃圾回收确成为了制约Java应用的瓶颈.目前JDK ...

  2. Echarts中X轴坐标太密集,分段显示

    在axisLabel中设置刻度间隔interval,再加上强制显示最大值showMaxLabel和最小值showMinLabel axisLabel: {//X轴文字 interval: day == ...

  3. Linux 中使用 QT Charts 显示温度传感器

    前一篇笔记中实现了QT的Label控件显示CPU的温度,只能显示当前的温度,并不能反映CPU温度的变化情况,现在来实现使用QT Charts的曲线图实现一个实时曲线来显示CPU的温度. 添加对Qt C ...

  4. leetcode动态规划题目总结

    Hello everyone, I am a Chinese noob programmer. I have practiced questions on leetcode.com for 2 yea ...

  5. js笔记6

    1.函数都有返回值,人为return,返回什么就是什么,否则,他的返回值就是undefined 而方法的本质也是函数,所以也有返回值 document.getElementById()返回的是获取的标 ...

  6. 关于Word转Markdown的工具Writage安装及使用

    简介 Writage是为希望开始编写结构良好的文档,没有时间或不想深入了解 Markdown 语法的详细信息,或者更愿意使用 Word 作为文本编辑器的每个人设计的 下载并安装 安装包地址:https ...

  7. POJ 3126 Prime Path 简单广搜(BFS)

    题意:一个四位数的质数,每次只能变换一个数字,而且变换后的数也要为质数.给出两个四位数的质数,输出第一个数变换为第二个数的最少步骤. 利用广搜就能很快解决问题了.还有一个要注意的地方,千位要大于0.例 ...

  8. Kubernetes-22:kubelet 驱逐策略详解

    为什么要驱逐pod? 在可用计算资源较少时,kubelet为保证节点稳定性,会主动地结束一个或多个pod以回收短缺地资源,这在处理内存和磁盘这种不可压缩资源时,驱逐pod回收资源的策略,显得尤为重要. ...

  9. PYTHON 得到ADB的输出结果

    #利用ADB DEVICES结果判断指定手机是否正常连接,如果为offline,则adb disconnect sjh:adb connect sjh#如果没有,则执行adb connect sjhd ...

  10. 微信小程序云开发-云函数-数据库和云函数获取数据的区别

    一.数据库获取数据 1.1 数据库获取数据的写法 在本地创建的页面js文件中写代码 1.2 数据库获取数据返回数据限制20条 数据库获取数据,每次返回20条数据(数据库有108条数据) 1.3 数据库 ...