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>