HTML 自 10.3 以来,图像映射在 iOS 上不起作用

HTML Image maps not working on iOS since 10.3

所以我有一个带有 UIWebView 的应用程序,它基本上包含一个带有图像映射的图像作为自定义导航的一种形式。直到 iOS 10.2.x 这一切都很好,但是从 10.3.1 开始,我的用户一直在报告说点击图像地图扇区不再有效。

我已经在应用程序中以及 iOS Safari 中的 HTML 文件中对此进行了测试,图像映射似乎不再起作用。它在 Mac 上的 Safari 中仍然有效,但这对我没有用。

其他图像映射也可以,例如 this w3schools 上的图像映射。我的怎么了?

我是否可以进行任何更改以使图像映射再次起作用?

这是我用于图像映射的 HTML:

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" style="width:100%; height:100%;">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, shrink-to-fit=YES">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
</head>
<body>
    <p>
        <img name="triangle" src="triangle.png" usemap="#m_trianglemap" />
    </p>
    <map name="m_triangleMap">
        <area alt="activity" title="" href="activity" shape="poly" coords="1,389,491,390,447,325,42,325"/>
        <area alt="water" title="" href="water" shape="poly" coords="82,258,41,323,447,325,399,261" />
        <area alt="carbs" title="" href="carbs" shape="poly" coords="122,190,80,257,398,257,352,191" />
        <area alt="vegetables" title="" href="vegetables" shape="poly" coords="123,190,247,191,246,131,161,129" />
        <area alt="fruit" title="" href="fruit" shape="poly" coords="249,191,355,192,317,131,247,131" />
        <area alt="dairy" title="" href="dairy" shape="poly" coords="160,127,243,129,242,65,199,66" />
        <area alt="meat" title="" href="meat" shape="poly" coords="245,130,315,131,271,64,244,65" />
        <area alt="fat" title="" href="fat" shape="poly" coords="217,39,201,64,273,65,258,41" />
        <area alt="rest" title="" href="rest" shape="poly" coords="237,3,220,31,254,31" />
        <area alt="general" title="" href="general" shape="poly" coords="156,25,55,25,55,120,151,120" />
    </map>
</body>
</html>

所以我弄清楚了我的图像映射代码有什么问题。

如果你查看原始 post 中包含的代码,你会看到我的 usemap 是 #m_trianglemap 而地图名称是 m_triangleMap,只是大小写不同,基本上.在 10.3.1 之前的所有其他浏览器和 Safari iOS 上,usemap 不区分大小写。现在它是区分大小写的。一旦我更改了 usemap 值以匹配外壳中的名称,它又开始工作了。