指针事件在 IE 中没有按预期运行答案

【问题标题】：pointer-events none not behaving as expected in IE指针事件在 IE 中没有按预期运行
【发布时间】：2017-02-09 09:19:54
【问题描述】：

我遇到了pointer-events:none css 的问题。我正在尝试禁用combo box。现在这个 CSS 在 Chrome 和 Firefox 中可以完美运行，但在 IE 中只能部分运行。

虽然组合框在 IE 中仍然被禁用，但我可以单击组合框并显示不应该的下拉菜单。请指导我是否可以使用一些补丁。

下面是代码：

.pointer-events {
  pointer-events: none;
}

<select id="originPlaceId" name="originPlaceId" class="pointer-events" size="1" style="width:99%;">
  <option value="Tiger">Tiger</option>
  <option value="Lion">Lion</option>
</select>

【问题讨论】：

它在 IE9 和 10 中不起作用这可能会有所帮助：stackoverflow.com/questions/17441810/…
MSDN 还声称它可以在 IE11+ 中运行：msdn.microsoft.com/en-us/library/ff972269(v=vs.85).aspx
指针事件在 IE11 中确实有效。但是，如果浏览器处于兼容模式（或怪癖模式），则该功能将被关闭。
How to make Internet Explorer emulate pointer-events:none?的可能重复

标签： javascript jquery html css internet-explorer

【解决方案1】：

resolved here : stackoverflow

希望这会有所帮助:)

http://www.vinylfox.com/forwarding-mouse-events-through-layers/

您也可以尝试使用 javascript 解决方案：

http://jsbin.com/uhuto

function passThrough(e) {
    $(".box").each(function() {
       // check if clicked point (taken from event) is inside element
       var mouseX = e.pageX;
       var mouseY = e.pageY;
       var offset = $(this).offset();
       var width = $(this).width();
       var height = $(this).height();

       if (mouseX > offset.left && mouseX < offset.left+width && mouseY > offset.top && mouseY < offset.top+height)
         $(this).click(); // force click event
    });
}

$("#shield").click(passThrough);

var dthen = new Date();


var doPassThrough = true;
$('input').click(function(){
  doPassThrough =  !doPassThrough;
  if (doPassThrough){
    $("#shield").click(passThrough);
  } else {
    $('#shield').unbind('click', passThrough);
  }
});

【讨论】：

【解决方案2】：

您可以在 Internet Explorer 中使用插件： pointer events polyfill

【讨论】：