ie9及以下不支持pointer-events: none，需用透明遮罩替代：设position:absolute/fixed、background:transparent、aria-hidden="true"，避免内联事件；ie8/9须js事件代理拦截。

IE9及以下根本不支持pointer-events: none

写了pointer-events: none却依然点不透，不是样式没生效，而是IE9-压根不解析这行CSS——它返回的计算样式是auto或空字符串，@supports (pointer-events: none)也无效，因为IE连@supports语法都不认识。所有基于该属性的穿透逻辑，在这些浏览器里等于没写。

用透明遮罩替代是最稳定方案

核心不是“禁用事件”，而是让遮罩层视觉存在、但完全不参与事件流：

CSS婚礼策划服务机构宣传网站模板

CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。

下载

• 遮罩必须设position: absolute或position: fixed，且z-index高于目标内容
• 背景只能用background: transparent；避免rgba(0,0,0,0)（IE8不支持）
• 绝对不要给遮罩加任何onclick、onmousedown内联事件，也不绑定JS监听器
• 若遮罩需随滚动同步位置，监听scroll手动更新top/left，或改用position: fixed + transform: translateZ(0)（IE10+才触发硬件加速）

必须配套aria-hidden保障可访问性

透明遮罩对屏幕阅读器仍是可见节点，不处理会导致读屏软件朗读一个“空遮罩”：

• 给遮罩加aria-hidden="true"
• 如果遮罩内有语义化内容（比如关闭按钮），应把按钮移出遮罩DOM结构，或用aria-labelledby等显式关联
• 避免用display: none或visibility: hidden隐藏遮罩本身——它们会破坏视觉覆盖，且visibility: hidden在IE中仍可能拦截事件

JS事件代理是IE8/IE9唯一可行 fallback

当项目必须支持IE8时，CSS方案直接放弃，全部交由JS控制事件流向：

• 监听document或最近公共父容器的mousedown/click（别用pointerdown，IE10+才有）
• 用e.target向上遍历，检查是否落在被禁用区域（如含data-disabled或no-click类）
• 确认后调用e.preventDefault()和e.stopPropagation()；IE8中preventDefault不存在，得回退到e.returnValue = false
• 不要给每个子元素加onclick="return false"，容易漏掉动态插入节点

真正容易被忽略的是：透明遮罩的z-index必须严格高于目标内容，但又不能过高——否则可能意外盖住其他弹窗或工具栏；同时，IE中overflow: hidden父容器会裁剪position: absolute遮罩，导致边缘点击失效，这点必须真机验证。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！