代码之家 › 专栏 › 技术社区 › Alex

处理z索引图层上的单击事件

z-index event-handling javascript

Alex · 技术社区 · 15 年前

我遇到的问题是,不管发生什么,都会引发事件,但当单击顶层的某个对象时,事件的originalTarget属性不是底层中的图像。有没有办法改变这个?

4 回复 | 直到 14 年前

SpliFF 7 年前

这叫做事件冒泡,您可以使用 event.stopPropagation() 方法( event.cancelBubble() 在IE中)。您还可以通过从元素上的onwhere属性调用的处理程序返回true/false来控制它。这是一个棘手的问题,所以我建议你做一些 research

信息: cancelBubble , stopPropagation

Cranium Slows 15 年前

编写一个名为onClick的函数,让该函数有足够的智能知道是谁调用了它。然后,该函数根据单击它的用户采取适当的操作。你可以发送任何独一无二的东西,然后使用开关。

简化示例:

<html>
<body>

<script type="text/javascript">
function myClickHandle(anID)
{
switch(anID){
case 'bottom': 
      alert("I am on the bottom");
      break;
case 'top':
      alert("I am on the top");
      break;
}
}
</script>

<html>
<div style="z-index:10"><input type=button value='top' onclick="myClickHandle(this.value)"/></div>
<div style="z-index:11"><input type=button value='bottom' onclick="myClickHandle(this.value)"/></div>
</body>
</html>

Shreyas 15 年前

我认为最好的做法是在控件移动到上层时分离事件处理程序,当控件返回到下层时,可以重新附加事件。

richsage 13 年前

优先考虑具有大z指数的元素

http://api.jquery.com/event.stopPropagation/

推荐文章

Pikachu620 · 可以对事件列表进行排序吗?

2 年前

ManP22 · 我想在同一次单击中调用两个常量

2 年前

Pepe · 如何在JavaScript中的函数之间恢复/传递事件对象

2 年前

andycrt · TypeError:路径。join不是函数(在我的handleEvents.js文件中得到错误)

2 年前

Steve Proschenko · bash中的Nagios事件处理程序脚本,用于重新启动服务,如果服务未启动,则在满足条件之前不要重新启动下一个服务

6 年前

NJM · 最新版本的firefox和chrome版本及javascript

6 年前

Juan Salvador Portugal · javascript更改输入值时触发更改或输入

6 年前

Mor Sagmon · 关闭wx。通过单击另一个类中的按钮,从面板中的事件处理程序中创建对话框

6 年前

Thomas Mavrofides · jQuery取消绑定事件处理程序不工作

6 年前

Jaime Montoya · jQuery中submit()事件的事件委派

6 年前