添加支持苹果移动网络应用程序的可阻止识别 SVG 触摸

Adding apple-mobile-web-app-capable stops SVG touches being recognised

本文关键字:识别 触摸 SVG 应用程序 苹果 支持 移动 移动网 网络 添加      更新时间:2023-09-26

我正在尝试为SVG添加触摸功能。

我使用类似jQuery的选择器识别触摸事件。(我实际上正在使用角度 JQLite - angular.element(((:

 .on("mousedown touch", function(event) {

在我的桌面和移动 Safari 中,没有问题。触摸被正确识别。当另存为书签时,它也会正确响应,但是当我包括:

  <meta name="apple-mobile-web-app-capable" content="yes" />

在我的标题中,并保存到主屏幕.. 触摸部分没有响应。

我想知道是否有人知道此原因的根本原因或有解决方法?我正在使用 Angular 1.2.27 和 iOS 8

有关信息,我通过在 SVG 本身中嵌入 ng 单击来解决此问题。

这倾向于指出 click/moousedown/touchstart 的角度 JQLite 实现是原因,或者可能不支持与 ng-click 相同的触摸事件。

将以下行添加到您的 css 文件中。

svg {
    pointer-events: none;
}

现在它应该可以工作了。