jQuery 单击位于另一个 div 之上的 div

2024-06-06

我的 jQuery 有问题click当选择器是 a 时div那是在另一个之上div正如这里所看到的..

the html

<div id="parent">
 <div id="child">
 </div>
</div>​

css

#parent{
 background-color:red;
 width:100px;
 height:100px;   
 position:relative;
}


#parent:hover #child {
 display:block;

}
#child{
 background-color:yellow;  
 width:10px;
 height:10px;  
 border: 1px solid black;
 position:absolute;
 display:none;
 bottom:0;
 right:0;
}

js

$("#parent").bind("click", function() {
    alert('you clicked on red');
});

$("#child").bind("click", function() {
    alert('you click on yellow');
});​

如果你点击红色#parent它会发出适当的警报。如果你点击黄色#child,它会发出黄色警报和红色警报。

See the jsfiddle http://jsfiddle.net/qTdkt/3/

有没有办法来解决这个问题?


使用 jQuery 的.stopPropagation() http://api.jquery.com/event.stopPropagation/

$("#parent").bind("click", function() {
  alert('you clicked on red');
});

$("#child").bind("click", function(e) {
  e.stopPropagation();
  alert('you click on yellow');  
});​

http://jsfiddle.net/qTdkt/4/ http://jsfiddle.net/qTdkt/4/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery 单击位于另一个 div 之上的 div 的相关文章

  • 有人可以离线编辑 javascript 文件来运行恶意代码吗?

    我担心与我网站的 javascript 文件相关的问题 我不确定这是否可行 当有人访问网站时会下载js文件 如果有人编辑下载的js脚本并插入自己的代码 然后刷新网站怎么办 在新的刷新中 网站将读取编辑后的 Js 文件并运行恶意代码 恶意代码
  • RichFaces 4 替换

    我目前正在使用 RichFaces 3 3 将旧版 JSF 1 2 应用程序迁移到 JSF 2 0 和 RichFaces 4 但是 包含与 RichFaces 捆绑在一起的 jQuery 库不再有效
  • 如何在 TypeScript 中扩展 JQuery 函数

    我正在 TypeScript 上重写一些 JS 代码 并遇到模块导入问题 例如 我想写我的toggleVisiblity功能 这是代码
  • 对象预期错误、javascript、jQuery

    我在 javascript 文件中收到一个对象预期错误 在这种情况下 这是否意味着 jQuery 文件未正确包含 导致错误的行是 function 浏览器中的错误是 Message Object expected Line 6 Char 1
  • 如何创建 jqGrid 上下文菜单?

    我正在尝试在 jqGrid 上创建一个上下文菜单 针对每一行 但找不到如何执行此操作 我目前正在使用 jQuery 上下文菜单 有更好的方法吗 但它适用于整个网格 而不是一个特定行 即无法对其执行行级操作 请帮助我 谢谢 document
  • 如何使用 AOS 触发向上滚动动画

    我正在使用 AOS 库 css 和 js 它可以帮助我创建每次用户向下滚动页面时触发的动画 我有一个问题 页面的顶部元素仅运行一次 因为 AOS 仅在向下滚动时触发它 我希望我的所有动画在每次用户向下和向上滚动时运行 我怎样才能做到呢 这是
  • Gridstack.js 从 JSON 获取位置

    我现在正在与Gridstack js https github com troolee gridstack js这对我有好处 但是 总是有一个但是 有人知道我如何定位 JSON 数组中定义的 grid stack item 吗 HTML 示
  • 如何使用 JQuery 获取 Json 记录总数?

    我找不到任何有关使用 jQuery 获取 JSON 记录总数的信息 这是返回的 JSON Email Please enter your Email Password Please enter a password 这是我的代码 funct
  • 在 Rails 3 中使用 jQuery 插件

    完成哈特尔的伟大导轨教程我现在正在努力实现非常好的目标jQuery 新手到忍者由卡斯尔丁和沙基创作 虽然我能够在我的 Rails 项目中包含 jquery js 和 jquery ui js 但在添加其他 jQuery 插件时我遇到了困难
  • jQuery datepicker 无法正确更新值

    在我目前正在工作的网站上 我有一个用于添加事件的表单 此事件需要用户使用 jQuery 日期选择器选择日期 一个日期只能有一个事件 所以我想检查用户在日期选择器中插入的日期 我尝试通过在用户选择日期后获取值来执行此操作 然而问题是 日期选择
  • 如何使用 jQuery 在输入元素上实现占位符文本?

    我如何在输入上实现 jquery 提示文本
  • JS/jQuery:文本区域中出现了多少个字符

    假设 str value 这是一些文本 我想计算 t 出现了多少次 该怎么做 使用正则表达式更容易 var regex new RegExp t gi var count This is some text match regex leng
  • 使用 jQuery 禁用 CSS 继承

    有没有办法使用 jQuery 或通用 javascript 在块级别禁用 CSS 继承 例如 如果我通过 javascript 拉入外部资源 例如 Pastie org 它们将拥有自己的 CSS 而我的 CSS 会覆盖它们 我想将嵌入代码放
  • jQuery:append() 与appendTo()

    我正在测试 jQuery append vs appendTo 使用以下代码的方法 div gt id id text this text appendTo div type item id div type item id append
  • 如何捕获jquery中的任何点击事件[重复]

    这个问题在这里已经有答案了 我有一个按钮 当单击它时 会显示一个带有图像的 div 例如聊天的表情符号面板 如果我再次单击它 div 会隐藏 但我想要做的是 如果 div 已经显示 然后我单击页面的任何其他内容 我想隐藏它 我试过这个 my
  • jQuery Mobile 和文本区域行

    所以 我想展示一个textarea仅 1 行 但 jQuery Mobile 并不这么认为 无论我在rows属性 它始终是 2 行高度 请问有什么解决办法吗 jQuery Mobile CSS 设置了特定的高度textarea要素 text
  • JavaScript 变量带有一个我需要在 Html.ActionLink 中使用的 ID

    我的 jQuery 代码中有一个 JavaScript 变量 其中包含一个我需要在我的Html ActionLink但它不起作用 Html ActionLink Genomf r AnswerForm AnswerNKI new id go
  • 暂停或停止整页而不破坏

    我有一个正常滚动的页面 页面上有一个锚点 它会弹出一个模式 我在其中初始化 fullpage js 到目前为止 效果很好 但是当用户单击关闭图标时 我希望模式窗口关闭 并使 fullpage js 暂停或停止 以便禁用全页滚动效果 除非用户
  • 即使切换它时,hasClass 也始终返回 false

    我有以下代码
  • 如何防止 Bootstrap Navbar Toggle 下推内容?

    我将 Bootstrap 与静态顶部导航栏一起使用 如下所示

随机推荐