javascript IE 11 指针事件覆盖

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26718261/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 06:22:34  来源:igfitidea点击:

IE 11 Pointer Events Override

javascriptcssinternet-explorer-11pointer-events

提问by wayofthefuture

I am trying to override the pointer-events property for a containing div. It works in everything so far except IE 11. Supposedly, the pointer-events property was added to IE 11. For some reason, it won't override though.

我正在尝试覆盖包含 div 的指针事件属性。到目前为止,它适用于除 IE 11 之外的所有内容。据说,指针事件属性已添加到 IE 11。出于某种原因,它不会被覆盖。

.divstyle {
    pointer-events: none;
}
.buttonstyle {
    pointer-events: auto;
}

<div class="divstyle">
    <table>
        <tr><td>
            <input type="button" class="buttonstyle" value="test">
        </td></tr>
        <tr><td>
            <!-- A BUNCH OF CONTENT THAT I DON'T WANT TO HAVE POINTER EVENTS -->
        </td></tr>
        <tr><td>
            <!-- AND ON AND ON -->
        </td></tr>
    </table>
</div>

The entire div doesn't allow pointer events, including the button. I would think since the div doesn't have the events at all, IE is supporting the property pointer-events, but when I explicitly set the child to have the events, it won't allow it for some reason. Thank you for your help!

整个 div 不允许指针事件,包括按钮。我认为由于 div 根本没有事件,IE 支持属性指针事件,但是当我明确设置子级具有事件时,由于某种原因它不会允许它。谢谢您的帮助!

回答by frodo2975

I had the opposite problem in IE11, I was setting pointer-events: noneon a parent element, but a link inside that element was still responding to clicks! As it turned out, a span inside the link had position: relative, which made it ignore the parent's pointer-events property.

我在 IE11 中遇到了相反的问题,我pointer-events: none在父元素上进行设置,但该元素内的链接仍在响应点击!事实证明,链接内的一个跨度有position: relative,这使它忽略了父级的指针事件属性。

回答by Lorin

For anyone that finds this - IE11 ignores the pointer-events property on inline items such as tags. Simply switch the display property to anything else for it to function correctly.

对于发现这一点的任何人 - IE11 会忽略内联项目(例如标签)上的指针事件属性。只需将显示属性切换到其他任何内容即可正常运行。

回答by dps

I believe this will fix your problem:

我相信这会解决您的问题:

https://coderwall.com/p/s8pjpg/reseting-pointer-events-on-ie11

https://coderwall.com/p/s8pjpg/reseting-pointer-events-on-ie11

So, for your code:

因此,对于您的代码:

.divstyle {
    pointer-events: none;
}
.buttonstyle {
    pointer-events: auto;
    position: relative;
}

回答by Sooraj

perfectly works using inline block .. display: inline-block;

使用内联块完美工作.. display: inline-block;

even by class name works well

即使按类名也能很好地工作

a.pa-description {
  pointer-events: none;
 cursor: default;
display: inline-block;
color: gray;
}