嵌套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 ...
随机推荐
- 在Visual Studio 中使用git——同步到远程服务器-上(十一)
在Visual Studio 中使用git--什么是Git(一) 在Visual Studio 中使用git--给Visual Studio安装 git插件(二) 在Visual Studio 中使用 ...
- noip2007 总结
统计数字 原题 某次科研调查时得到了n个自然数,每个数均不超过1500000000(1.5*10^9).已知不相同的数不超过10000个,现在需要统计这些自然数各自出现的次数,并按照自然数从小到大的顺 ...
- asp.net core 实现 face recognition 使用 tensorflowjs(源代码)
功能描述 上传照片文件名及是系统要识别标签或是照片的名称(人物标识) 提取照片脸部特征值(调用 facemesh模型) 保存特征值添加样本(调用 knnClassifier) 测试上传的图片是否识别正 ...
- golang 用defer 捕获error 需小心
有时一个函数内需要根据最后是否出错,决定是否执行某个操作.这时候如果函数的分支又比较多,就会比较麻烦了. defer 处理这个情况刚好合适 func main() { var err error by ...
- 关于Android Studio Emulator常见使用问题
Q:模拟器无法初始化声音相关设备 Emulator: dsound: Could not initialize DirectSoundCapture Emulator: dsound: Reason: ...
- 深入学习Netty(1)——传统BIO编程
前言 之前看过Dubbo源码,Nacos等源码都涉及到了Netty,虽然遇到的时候查查资料,后面自己也有私下学习Netty并实践,但始终没有形成良好的知识体系,Netty对想要在Java开发上不断深入 ...
- Linux-Jumpserver服务
1.介绍 Jumpserver是一款由python编写开源的跳板机(堡垒机)系统,实现了跳板机应有的功能.基于ssh协议来管理,客户端无需安装agent. 特点: 完全开源,GPL授权 Python编 ...
- SpringCloud:feign对象传参和普通传参及遇到的坑
对象传参: #使用@RequestBody来指定传参对象 @RequestMapping(value = "/v2/matterCode/genCode", method = Re ...
- 第八章 - JUC
J.U.C AQS 原理 全称是 AbstractQueuedSynchronizer,是阻塞式锁和相关的同步器工具的框架 特点: 用 state 属性来表示资源的状态(分独占模式和共享模式),子类需 ...
- redis学习笔记(二)——java中jedis的简单使用
redis怎么在java中使用,那就是要用到jedis了,jedis是redis的java版本的客户端实现,原本原本想上来就直接学spring整合redis的,但是一口吃个胖子,还是脚踏实地,从基础开 ...