[英]How to create a “Desktop Version” link on mobile website without it redirecting to the mobile site
So, I have seen this asked before but with no real answer (unless I am missing it). 因此,我之前已经看到过这个问题,但是没有真正的答案(除非我错过了它)。
I am using this to redirect to the mobile site on site.com 我正在使用它重定向到site.com上的移动网站
if (screen.width <= 800) {
window.location = "/m";
}
And simple HTML to redirect to desktop version on m.site.com 和简单的HTML重定向到m.site.com上的桌面版本
<a href="../"> Desktop Version </a>
but of course, it redirects to the mobile version due to the if statement above. 但当然,由于上述if语句,它会重定向到移动版本。
How can I remedy this with the use of javascript? 如何使用javascript进行补救?
Thank you. 谢谢。
Local storage is widely supported, so let's use it. 本地存储受到广泛支持,因此让我们使用它。 No need to bother with cookies. 无需理会cookie。
If we do something like this on click for the "Desktop Version" link that is shown on the mobile site: 如果我们点击移动网站上显示的“桌面版本”链接,则需要执行以下操作:
localStorage.setItem("forceToDesktop", "true")
// Followed by redirect to desktop with JS
And we modify our screen width check to include a check for the above value: 然后,我们修改屏幕宽度检查,以包括对上述值的检查:
if (localStorage.forceToDesktop !== "true" && screen.width <= 800) {
// Do redirect stuff
}
This will show the mobile site if the forceToDesktop value has not been set, and if the screen width is less than or equal to 800. 如果未设置forceToDesktop值,并且屏幕宽度小于或等于800,将显示移动站点。
However, there is still one part of the puzzle missing. 但是,仍然缺少这一难题的一部分。 How does a mobile user get back to the mobile site, after choosing to see the desktop site only? 选择仅查看桌面网站后,移动用户如何返回到该移动网站?
We need to remove the forceToDesktop value somehow. 我们需要以某种方式删除forceToDesktop值。 I would do something like this. 我会做这样的事情。
if (localStorage.forceToDesktop === "true" && screen.width <= 800) {
// Add a link to the page called something like "view mobile site",
// and have it run the below javascript function on click
var backToMobile = function () {
localStorage.removeItem("forceToDesktop");
// Redirect back to the mobile version of the page,
// or just redirect back to this page, and let the normal
// mobile redirect do its thing.
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.