javascript 如何禁用除单击之外的所有鼠标事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31036356/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to disable all mouse events except click?
提问by ???? ??????
I want to disable all mouse events except click, I have this:
我想禁用除点击之外的所有鼠标事件，我有这个：
.info {
-webkit-transform: rotate3d(1, 0, 0, 90deg);
transform: rotate3d(1, 0, 0, 90deg);
width: 100%;
height: 100%;
padding: 20px;
position: absolute;
top: 0;
left: 0;
border-radius: 4px;
pointer-events: none;
background-color: rgba(26, 188, 156, 0.9);
}
but pointer-events: none; disables all events.
但指针事件：无；禁用所有事件。
回答by br0tat0
The pointer-events attribute only has three properties:
指针事件属性只有三个属性：
- none,
- auto,
- inherit
- 没有任何，
- 汽车，
- 继承
So if you attach
所以如果你附上
pointer-events: none;
to an element all events will be disabled.
对于一个元素，所有事件都将被禁用。
pointer-events: auto;
however restores all default functionality and is good for if an element's parent has pointer-events: none.
但是恢复所有默认功能，并且适用于元素的父元素具有指针事件：无。
A workaround that I think you'd find useful (aside from some JavaScript manipulation), is to wrap your objects in a parent container and add
我认为您会发现有用的一种解决方法（除了一些 JavaScript 操作）是将您的对象包装在父容器中并添加
pointer-events: none;
to that parent container and use:
到该父容器并使用：
pointer-events: auto;
on .info and add .info to the child elements of the container.
on .info 并将 .info 添加到容器的子元素。
It won't accomplish exactly what you're looking for but it will replicate that click only illusion.
它不会完全完成你正在寻找的东西，但它会复制那种只有点击的错觉。
回答by Devaarth
One approach is to first make all instances of any one elements as :
一种方法是首先将任何一个元素的所有实例设为：
pointer-event:none
For example here I am making all imgtags as pointer-event:nonein css files:
例如，我在 css 文件中制作所有img标签pointer-event:none：
img{
pointer-event:none
}
then you have to enclose your clickable element( for e.g img) inside another tag(like div, span)
然后你必须将你的可点击元素（例如img）包含在另一个标签中（例如div, span）
For example:
例如：
<div class="enclosing-img-class" click="sampleEvent()">
<img src="sample.png" alt="No Image available">
</div>
