嵌套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 ...
随机推荐
- SQL Sever提权
前言:渗透测试中提权是较为重要的环节,若以低权限身份进行后渗透,测试出的问题相对于高权限的质量会低很多,从一个普通用户,通过手段让自己变为管理员,也可利用操作系统或者应用程序中的错误,设计缺陷或者配置 ...
- 【题解】Grape luogu1156改 dp
考试时被数据坑了 题目 原题 传送门 题目描述: 众所周知的是oyyf 沉迷葡萄,今天的oyyf为了葡萄溜到了He 大佬家的葡萄园偷葡萄,可惜的是还没偷到葡萄He 大佬就来葡萄园了,吓的oyyf 直接 ...
- Java源码分析:Guava之不可变集合ImmutableMap的源码分析
一.案例场景 遇到过这样的场景,在定义一个static修饰的Map时,使用了大量的put()方法赋值,就类似这样-- public static final Map<String,String& ...
- Java程序安装失败
检查文件路径,应该不含中文汉字,空格以及特殊字符.应将jdk的安装目录设置为纯英文路径. 是否有多个安装程序同时运行,若多点安装程序则会安装失败,打开任务管理器,查看是否有多个安装程序运行 注册表 ...
- AS打包签名
1.进入项目,然后点击菜单栏的Build -->Generate Signed APK... (如下图所示) 2.点击之后会出现下图,我这个是我以前有过KEY了,如果你以前没有过的话,都是空 ...
- C++中指针与引用详解
在计算机存储数据时必须要知道三个基本要素:信息存储在何处?存储的值为多少?存储的值是什么类型?因此指针是表示信息在内存中存储地址的一类特殊变量,指针和其所指向的变量就像是一个硬币的两面.指针一直都是学 ...
- POJ 3984 迷宫(BFS)
入门BFS,第一次做,部分借鉴了大牛的 #include <iostream> #include <cstdio> #include <queue> using n ...
- 二维动态规划&&二分查找的动态规划&&最长递增子序列&&最长连续递增子序列
题目描述与背景介绍 背景题目: [674. 最长连续递增序列]https://leetcode-cn.com/problems/longest-continuous-increasing-subseq ...
- Java:Java单例中的懒汉和饿汉模式
1.懒汉模式 懒汉模式:在类加载的时候不被初始化,懒汉式是延时加载,他是在需要的时候才创建对象. public class JdbcUtil { //定义私有的引用 private static Jd ...
- 使用 Java 和 Maven (JBake) 生成静态网站
使用 JBake("mvn generate-resources")构建您的静态网站或博客.使用布局.宏和数据文件. 我们迁移了整个www.optaplanner.org网站(13 ...