0

这对我来说是全新的，不知道我在做什么，所以我真的更喜欢一个简单实施的解决方案（如果它存在的话）。

我需要将在移动设备（不是平板电脑）上访问 www.domain.co.uk（托管在 Wordpress 上）的用户重定向到这样的特定页面（使用 WP 的永久链接）：

www.domain.co.uk/mobile-home

从那个移动页面，我还需要提供一个链接返回到同一域上的桌面主页，如下所示：

www.domain.co.uk/desktop-home

我一直在我的 header.php 文件中使用与此类似的代码：

<script>if( 'ontouchstart' in window ) window.location = 'mobile.html';</script>

但如果我直接链接到桌面页面，它只会将移动用户重定向回移动版本。如何获得我需要的功能？

更新

好的，我的第一步是将我的移动访问者引导到移动页面。因此，我已将以下代码粘贴到我的网站主页的页面模板中，并且经过测试似乎可以正常工作。我把它放在开头的“body”标签下面：

<script>
if( /Android|webOS|iPhone|iPod|BlackBerry|IEMobile/i.test(navigator.userAgent) ) {
window.location = "176.32.230.17/domain.co.uk/m";
}
</script>

现在我无法使用以下代码链接回主页。它带我回到主页，但主页上面有检测设备的代码，并不断带我回到移动网站。我是否将设备检测放在正确的位置？：

<a href="http://176.32.230.17/domain.co.uk/?ref=desktop">Link back to desktop website</a>
4

4 回答 4

1

因此，通过使用@Phillip 的代码，我设法为我的问题提出了一个完整的解决方案。

我将以下 JS 放置在我的 header.php 模板中以检测用户代理是否是移动设备，如果是则执行另一次检查以查看 URL 是否包含主题标签“#desktop”，如果包含，则不执行任何操作并让用户继续使用桌面版。如果没有，则重定向到移动网站：

JS

<script>
if( /Android|webOS|iPhone|iPod|BlackBerry|IEMobile/i.test(navigator.userAgent) ) {

if(window.location.hash == "#desktop"){
    // Stay on desktop website
} else {
    window.location = "http://www.domain.co.uk/m";
}

}
</script>

然后要完成循环，在移动网站上添加一个链接，将标签“#desktop”添加到 URL，确保它们不会自动重定向回移动版本：

<a href="http://www.domain.co.uk/#desktop">View desktop site</a>
于 2013-03-05T12:23:07.727 回答
1

您可以使用 的用户代理属性检测移动浏览器navigator并将访问者重定向到移动页面。平板电脑和手机之间的差异并不可靠（iE 是平板电脑还是手机？）

if( /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ) {
    window.location = "yourmobileurl.com/?ref=desktop";
}

在服务器上，您可以检查桌面的 ref var 并向访问者显示链接以返回并将选择存储在会话中

于 2013-03-04T17:08:51.267 回答
1 
var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

请参考此链接：http ://www.abeautifulsite.net/blog/2011/11/detecting-mobile-devices-with-javascript/

它解释了如何使用 javascript 检测设备

于 2013-03-04T17:08:54.657 回答
0

一种解决方案是让返回桌面版本的链接具有 url 参数，并且仅在未设置该参数时从桌面转发到移动设备。

至于检测设备，您必须阅读用户代理并提供逻辑。 这是检测 iPad 和 iPhone 的链接。类似的用户代理适用于其他人。没有灵丹妙药来识别平板电脑。

您可以通过了解他们的用户代理返回的内容来识别大多数特定设备，但这始终可以更改，并且您必须为每个可能的平板电脑执行此操作。

至于参数解决方案，这似乎很简单。您将链接到http://www.mywebpage.com/MyDesktopHome?forwardToMobile=no。否则，您可以将其存储在会话或 cookie 中，具体取决于您希望将其保留多长时间。

于 2013-03-04T16:55:16.957 回答