Question

您好我遇到浏览器检测和Cookie问题。我希望通过“不再显示我”复选框向iPhone或Android用户显示消息，访问我的网站。我不能使用PHP或Jquery所以我必须坚持使用strait javascript。我需要关注事件发生：

如果Android
和
如果没有设置Cookie显示消息
否则什么都不做

我是编码的新手，所以任何帮助都会非常感激。

Answer 1

您可以使用Cookie，但网页存储更易于使用。较旧的浏览器（IE7和Opera mini）可能不支持Web存储，但both iOS safari and Android browser do。

关于浏览器检测（您应该使用特征检测），navigator对象存储了几个有用的属性，即userAgent和platform。 appName也可用，但似乎没用（Chrome 23报告“Netscape”）。

从用户代理中推断很多是一项棘手的事情，但

Android默认浏览器在其用户代理（ref.）中报告“Android”
对于iOS，在用户代理（ref.）

iPad

iPhone

尝试：

if(window.localStorage
  && !localStorage.getItem("dialogShown")
  && /Android|iPad|iPhone/.test(navigator.userAgent)
){
  // show the dialog (unhide an element)
}

解除对话框时

：

var checkbox /* = document.getElementById(...) */;

if(checkbox.checked){
  localStorage.setItem("dialogShown",true);
}

Answer 2

所以你有两件事要做：

第一次 - 浏览器检测

通过javascript进行浏览器检测很棘手，我建议您查看this post以了解它。

您必须捕获Android和iPhone浏览器，并且它们都在其用户代理中具有“移动”字符串（与所有体面的移动浏览器一样），因此您可以使用以下功能执行此操作：

function isMobile() {
    return (/mobile/i).test(window.navigator.userAgent);
}

在移动浏览器中，此功能将返回true。

查看this question的其他方法。

第二次 - Cookie访问

Cookie“API”是一个更糟糕的界面。要处理它，你必须将你的key = value数据写入document.cookie（阅读MDN's documentation）。

因此，如果您想在Cookie上存储用户偏好，您可以执行以下操作：

document.cookie = "skip_message=1"

正如我所说，cookie API接口有时会非常棘手，因此您应该使用第三方库来读取写入cookie。 MDN文档中的小框架是一个很好的框架。

您的目标浏览器具有更多高级功能，因此如果您不需要支持旧浏览器，我建议您使用localStorage

如果尚未设置cookie，如何为某些浏览器显示消息

2 个答案: