jQuery - 触发单击后面的元素 [英] jQuery - Trigger click even on element behind

问题描述

我的问题是我有这个盒子也叫容器。在那个容器里面有一些用户可以点击的盒子。

My issue is that i have this box aka container. Inside that container there are boxes that the user can click.

为了在视觉上帮助用户我用灰色褪色的颜色
制作覆盖盒，告诉他们他们可以在这里使用这些方框。

To visually help the user I made overlay boxes with a gray faded out color that tells them they can use the boxes here.

但我的问题是点击事件位于覆盖框后面的框上。

But my issue is that the click event is on the boxes behind the overlay box.

那么有没有办法忽略元素的 .click（）并使用下一个目标？

So is there any way of ignoring a element's .click() and use next target?

< img src =https://i.stack.imgur.com/OYQr7.pngalt =在此处输入图像说明>

推荐答案

您可以使用CSS 指针 - 事件 属性：

You can use the CSS pointer-events property:

CSS属性 pointer-events 允许作者控制特定图形元素在什么情况下（如果有的话）可以成为鼠标事件的目标。

The CSS property pointer-events allows authors to control under what circumstances (if any) a particular graphic element can become the target of mouse events.

#element {
  pointer-events: none;
}

或者你可以触发 点击事件：

$('#box').click(function(){
   $('#target').trigger('click')
})

这篇关于jQuery - 触发单击后面的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！