jquery - 如果用户在移动设备上，则更改网页内容

Question

我在一个网站上有一个链接，它使用 jQuery 在弹出框中打开一个 iFrame。jQuery 脚本仅将此函数应用于具有特定属性 'id=calcPop' 的链接，如下所示。

<a href="calculator.html" id="calcPop">Click here</a>

它适用于所有计算机，但在移动设备上非常有问题。有没有办法检测用户是否在移动设备上，然后将其更改为没有“id”属性？

Answer 1

如果你不能使用像 PHP 这样的服务器端语言，那么只需使用 JS 删除 ID - 如果你有 jQuery，这样的事情就可以解决问题：

$("#calcPop").attr("id", "");

因为有很多移动设备，所以要检测你是否在移动设备上是相当复杂的。

你可以使用类似的东西：

var isMobile = navigator.userAgent.match(/Mobile/i) != null;

要在 UA 中使用 Mobile 查找内容（将匹配 iPod/iPad/iPhone），不确定其他内容，您必须检查。

把它放在一起，在你的 document.ready 闭包中：

var isMobile = navigator.userAgent.match(/Mobile/i) != null;
if (isMobile) {
    $("#calcPop").attr("id", "");
}

在 PHP 中，您可以执行以下操作：

<?php
$isMobile = (bool) strpos($_SERVER['HTTP_USER_AGENT'],'Mobile');

if ($isMobile) {
    $id = "calcPop";
} else {
    $id = "";
}
?>

<a href="calculator.html" id="<?= $id ?>">Click here</a>