今天意外发现,在 macOS Monterey 及更古老的 10.13.6 的 macOS High Sierra,页面 input 失效无法输入问题。新版 macOS 内核下的 Safari 浏览器,无此问题
Safari + owlCarousel 中 input 无法输入,失效的原因分析
1. 触控事件冲突
owlCarousel 的拖拽/滑动事件可能拦截了 touchstart
或 click
事件
旧版 Safari 对事件冒泡处理可能存在兼容性问题
2. CSS 层级干扰
Carousel 项的 z-index
或 overflow
属性导致 input 被遮挡
可能意外设置了 pointer-events: none
或 user-select: none
3. 元素克隆问题
如果启用了 loop
模式,owlCarousel 会克隆元素,可能导致原始 input 失效
Mac 10.13.6 的 Safari 版本较旧(约 Safari 13),可能存在特殊兼容问题
总结
最终排查到,页面启用了样式: pointer-events: none、user-select: none,去掉即可。
Safari 扩展阅读:
CommandNotFound ⚡️ 坑否 - 其他频道扩展阅读: