DIV事件置为空

solongzz
  • 78

<div class="1"></div>
<div class="2"></div>
2覆盖在1的上面。但是现在需要点击2的时候任然触发点击1的事件。
(实际情况是。div1其实是一个比较复杂的dom结构。因为视觉需求现在需要在这个dom结构上蒙上一层图层(因为架构问题不考虑使用svg实现),这个图层仅仅作显示效果没有交互。但是如果蒙上这层图层会影响到下面dom的一些列交互,有没有办法,蒙在上面的这层div相当于交互来说是不存在的)

回复
阅读 3k
5 个回答

css就可以做到,pointer-events:none;

你可以先给它们分别添加事件,然后在点击2的时候,主动触发1的事件,用jquery里的trigger就可以实现

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<div class="a">1</div>
<div class="b">2</div>
</body>
</html>
$(function(){
  $('.a').on('click',function(){
    alert(1);
  });
  $('.b').on('click',function(){
    
    alert(2);
    $('.a').trigger('click');
  });
});

点击div2触发div1?

那你div2的触发事件倒是写出来啊,还有div1触发效果是什么样子的?

讲的不清不楚,怎么帮你呢?

意思是页面上的布局div2覆盖了div1所以点不到div1?然后要求点div2的时候还是可以出发div1的点击是吧?很简单啊,你在div2的click处理事件中取到div1然后trigger它的click事件就ok了啊

<div onclick="fun()" class="1"></div>
<div class="2"></div>

$(".2").click(function(){
    fun();
});
宣传栏