有没有办法在我正在开发的网站中检测 iPadOS/iPad 设备？

Posted 2023-03-14

【中文标题】有没有办法在我正在开发的网站中检测 iPadOS/iPad 设备？

【英文标题】：Is there a way to detect iPadOS/iPad device in a website that I am developing?

【发布时间】：2020-12-24 01:19:28

【问题描述】：

我想知道的是：有没有一种方法可以使用 html、CSS 或 JS 来检测特定设备（iPad）？如果网站是在 iPad 上购买的，我希望能够禁用一些代码。到目前为止，我还不知道要禁用哪些代码，因为我还不知道是什么导致了问题，但我正在通过反复试验进行研究，看看是否可以通过某些更改让该网站在 iPad 上运行.

问题： 我设计了一个网站，该网站有一个使用 CSS 在其上移动的多边形的叠加层。该站点使用 HTML5、Bootstrap 4、Parallax（我知道如果没有变通办法，它不能在 iPad 上运行，这不是问题）和 JS。问题是，当网站在 iPad 上加载时它会闪烁，我认为是 CSS 构成了索引页面上的动画，但无论我打开哪个页面，它仍然会闪烁。我不知道原因是什么。网址是www.ace-of-he-arts.com。如果您在任何帮助之前看到过此内容，将不胜感激。

【参考方案1】：

您可以通过 navigator.platform 检查 ios 或任何其他设备（如 android）。你可以在这里阅读更多 -

https://www.w3schools.com/jsref/prop_nav_platform.asp

目前（2019 年）iPadPro 与其他平台的区别在于 iPadPro 支持触控。因此您可以使用它进行说明。

您可以使用以下几种有用的方法。

function isIOS() 
  var pl=navigator.platform.toString().toLowerCase();
  if (pl.includes("IPad") || pl.includes("IPhone") || pl.includes("IPod"))
    return true;
   else 
    return navigator.maxTouchPoints &&
      navigator.maxTouchPoints > 2 &&
      /MacIntel/.test(navigator.platform);
  


function isIpadOS() 
  return navigator.maxTouchPoints &&
    navigator.maxTouchPoints > 2 &&
    /MacIntel/.test(navigator.platform);