嵌套div的onClick事件问题
嵌套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事件问题的更多相关文章
- div的onclick事件怎么失效了?
1 前言 div是用拼接复制到另一个个div上,div的onclick事件中方法名为close,导致onclick=“close()” 触发不了,然后换了名称就可以了 2 代码 <!DOCTYP ...
- ie7中ul不能嵌套div和li平级
我要讲一个忧伤的故事,本以为清晰的层次结构,ul里不能嵌套div和li平级,不然会乱乱乱! 代码: <ul class="catshow"> ...
- 【转】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 ...
- onclick 事件
onclick 事件 Event 对象 定义和用法 onclick 事件会在对象被点击时发生. 请注意, onclick 与 onmousedown 不同.单击事件是在同一元素上发生了鼠标按下事件之后 ...
- js 中onclick 事件 点击后指向自己的对象,查找或者添加属性 用关键字this 传入参数 (可以改变原标签css)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 【winform】基于UserControl实现webBrower组件时html页面元素加载及onclick事件监听实现
[背景]基于System.Windows.Forms.UserControl实现的webBrower组件在html内使用window.external调用winform事件失败. [解决思路]借助wi ...
随机推荐
- 安装ogg软件报错:[INS-75012]Sofware Location specified is already an existing Oracle
1.安装ogg软件时报错: [INS-75012]Sofware Location specified is already an existing Oracle 2.根据报错,是说我们选择ogg软件 ...
- [Linux网络、命名空间、veth设备对、docker的host模式、container模式、none模式、brideg模式、网桥的增删查,容器与网桥的连接断开]
[Linux网络.命名空间.veth设备对.docker的host模式.container模式.none模式.brideg模式.网桥的增删查,容器与网桥的连接断开] 网络名称空间 为了支持网络协议栈的 ...
- git 认证问题之一的解决 : http ssh 互换
场景 使用git 我们经常会遇到 认证失败的情况,有时候确实是搞错了用户名或者密码,还有的时候及时用户名密码用对了也还是认证失败. 此时, 就有可能是下面这个情况. 没有配置 ssh 秘钥, 而用了 ...
- Java新一代单元测试框架JUnit5速览
为什么学JUnit5 Java技术栈的单元测试框架有两个:JUnit和TestNG,有种说法是TestNG比JUnit更强大,学TestNG就够了,但是当我打开GitHub看到star的时候,犹豫了: ...
- js笔记17
BOM浏览器对象模型 1.window.open(url,ways) url 是打开的网页地址 ways 打开的方式 _self 2.window.close() 3.浏览器用户的信息 window ...
- PUN丨实用API
原文地址:PUN丨实用API 当前房间人数 int num = PhotonNetwork.CurrentRoom.PlayerCount; 当前脚本是否属于当前玩家 //需继承MonoBehavio ...
- Spring:Spring-IOC实例化bean的常用三种方式
Spring容器提供了三种对bean的实例化方式: 1)构造器实例化 public class Demo { private String name; //getter和setter方法略 } < ...
- 10 shell test命令
0.test命令的用法 1.与数值比较相关的test选项 2.与字符串判断相关的 test 选项 3.与文件检测相关的test选项 4.与逻辑运算相关的test选项 5.注意点与总结 1.test中变 ...
- CG-CTF Our 16bit Games
一.放到xp上面跑,发现是一个图形界面的飞机游戏...估计是分数到达多少,然后就可以输出flag. 打开ida,一脸懵逼,主要这玩意16位,我直接静态调试了 发现很多汇编代码,有点懵逼,在最下方的地方 ...
- 关于scrollview的无限滚动效果实现
起因及需求:做过阅读器的朋友应该知道,一般的阅读器都会有仿真.平移等特效.最近赶上真空期,项目不忙,有点时间,于是想抓起来,总结点干货. 仿真翻页及平滑翻页的基本实现: 仿真翻页,使用系统自带的UIP ...