「指針事件：無」在IE9和IE10中不起作用

Question

CSS - 屬性pointer-events: none; 在Firefox中正常工作，但不在Internet Explorer 9-10中正常工作。

有沒有辦法在IE中實現這個屬性的相同行爲？有任何想法嗎？

Answer 1

從MDN文檔：

警告：在CSS中使用的指針事件非SVG元素是實驗性的。該功能曾經是CSS3 UI草案規範的一部分，但由於許多未解決的問題，該功能已推遲到CSS4。

Read more here，基本上，在非SVG（可升級矢量圖形）上的pointer-events是非標準的。
如果您檢查鏈接的頁面上的瀏覽器支持臺（約三分之二向下），你會注意到，在非SVG的IE支持ziltsh，插孔蹲，NAUT，...不支持， 那是。

一些挖後，我沒碰到過this article，它允許您通過使用層的模仿行爲，並且由於this post，我發現this JS-bin這可能會幫助...

然而，在IE瀏覽器（和Opera，並AFAIK所有的瀏覽器），你可以簡單地強制元素上的遊標：

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;

更新：

如果您希望阻止IE中的點擊事件（如shasi指出的那樣）在其他瀏覽器中阻止，只需添加委派click事件的事件偵聽器即可。
我假設，此刻，讓您指定的所有a元素：

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); 

這應該防止錨元素所有點擊事件。

Answer 2

從查看API中，我不認爲Rich Harris的Points.js或Hands.js都支持指針事件：無。

因此，我只是實現了一個很小的腳本來填充工具這一功能：

• Pointer Events Polyfill。

Answer 3

對於蹩腳的IE10，還有另一種解決方案，例如：

/* must be over the element that have the action */ 

.action-container:after { 
    content: ' '; 
    position: absolute; 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0; 
    z-index: 250; 
    background-color: grey; /* must have a color on ie10, if not :after does not exist... */ 
    opacity: 0; 
}