“pointer-events：none”在IE9和IE10中不工作 [英] "pointer-events: none" does not work in IE9 and IE10

问题描述

CSS-属性 pointer-events：none;
在Firefox中正常工作，但在Internet Explorer 9-10中不可用。

The CSS - property pointer-events: none; works fine in Firefox, but it does not in Internet Explorer 9-10.

有没有办法在IE中实现此属性的相同行为？任何想法？

Is there a way to achieve the same behaviour of this property in IE? Any ideas?

推荐答案

从MDN文档：

警告：在非SVG元素的CSS中使用指针事件是实验性的。该功能曾经是CSS3 UI草案规范的一部分，但由于许多开放的问题，已被推迟到CSS4。

Warning: The use of pointer-events in CSS for non-SVG elements is experimental. The feature used to be part of the CSS3 UI draft specification but, due to many open issues, has been postponed to CSS4.

a href =https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events>在这里阅读更多，基本上， pointer-events 在非SVG（可缩放矢量图形）上是非标准的。

如果您检查链接页面上的浏览器支持表（约三分之二），您会注意到在非svg的IE支持是 ziltsh ， jack squat ， naut ，...不支持，即

Read more here, basically, pointer-events on a non-SVG (Scalable Vector Graphic) is non-standard.
If you check the browser support table on the linked page (about two-thirds down) you'll note that IE support on non-svg's is ziltsh, jack squat, naut,... not supported, that is.

经过一番挖掘，我遇到了这篇文章允许你通过使用图层来模仿行为，并且，由于这篇文章，我找到这个JS-bin 这可能有帮助...

After some digging, I did come across this article that does allow for you to mimic the behaviours through use of layers, and , thanks to this post, I found this JS-bin That might help...

但是，在IE（和Opera和AFAIK所有浏览器）中，您可以简单地在元素上强制使用一种类型的游标：

However, in IE (and Opera, and AFAIK all browsers), you could simply force a type of cursor on an element:

a, a:hover, a:visited, a:active, a:focus /*, * <-- add all tags?*/
{
    cursor: default;/*plain arrow*/
    text-decoration: none;/*No underline or something*/
    color: #07C;/*Default link colour*/
}

结果应该类似于 pointer-events：none; code>

The result should be pretty similar to that of pointer-events: none;

更新：

点击IE中的事件，如shasi指出的，在其他浏览器中被阻止，只需添加一个事件监听器来委派点击事件。

我现在假设你定位所有 a 元素：

If you want to prevent the click events in IE that, as shasi pointed out, is prevented in other browsers, simply add an event listener that delegates the click event.
I'll assume, at the moment, that you're targeting all a elements:

var handler = function(e)
{
    e = e || window.event;
    var target = e.target || e.srcElement;
    if (target.tagName.toLowerCase() === 'a')
    {
        if (!e.preventDefault)
        {//IE quirks
            e.returnValue = false;
            e.cancelBubble = true;
        }
        e.preventDefault();
        e.stopPropagation();
    }
};
if (window.addEventListener)
    window.addEventListener('click', handler, false);
else
    window.attachEvent('onclick', handler);

这应该会阻止锚点元素上的所有点击事件。

That should prevent all click events on anchor elements.

这篇关于“pointer-events：none”在IE9和IE10中不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！