gpt4 book ai didi

jquery - 在具有较低 z-index 和部分覆盖的绝对定位 div 中检测点击?

转载 作者:太空宇宙 更新时间:2023-11-03 22:02:10 25 4
gpt4 key购买 nike

是否有可能检测到部分隐藏在 div 的所有区域中的绝对定位的 div(在其所有区域中)的点击?在这种情况下,我想在用户单击 div-1 的隐藏部分时检测单击。谢谢

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#div-1').bind("click", function () { console.log('div 1 cliked');});
//$('#div-2').bind("click", function () { console.log('div 2 cliked');});
});
</script>
</head>
<body>
<div id="div-1" style="position:absolute; top:10px; left:500px; z-index:500; width:100px; height:100px; background-color:#9999FF; display:block;"></div>
<div id="div-2" style="position:absolute; top:10px; left:540px; z-index:500; width:100px; height:100px; background-color:#CC9999;"></div>
</body>
</html>

最佳答案

简单的解决方案——指针事件:FIDDLE

在顶部元素上设置 pointer-events: none; 将使其点击通过,而点击将在底层元素上注册。问题是这也会禁用顶部元素上的其他“指针事件”,并且它仅在现代浏览器中受支持(阅读:不是 IE)。

否则你必须检查鼠标位置,看看它是否在第一个元素覆盖的区域内,这会稍微复杂一些,但也有关于这个的答案,试试搜索功能!

关于jquery - 在具有较低 z-index 和部分覆盖的绝对定位 div 中检测点击?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9656581/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com