问题描述:
有一个长按二维码图片识别的需求,代码是在一个静态页面中。在本地测试的时候完好,可以长按二维码图片进行识别;但是在部署到线上后发现,无论怎么按二维码图片都没有任何反应。
分析原因:
经排查发现,是因为上线后加载了另一个全局mobile.css样式文件
img {
pointer-events: auto !important;
}
这样就导致了样式被覆盖,鼠标点击事件被屏蔽。但是在本地因为只开了静态页面,所以没有加载mobile.css,不会被覆盖。
解决方法:
在img标签中写入内联样式,并加!important(不加仍然会被全局样式覆盖)
<img src="imgs/download_app.png" alt="" style="pointer-events: auto !important;">