因此,当用户在Mac上时,我try 将"关闭"按钮移到左侧,而当用户在PC上时,我会try 将"关闭"按钮移到右侧.现在,我通过判断用户代理来实现这一点,但是它太容易被欺骗,无法进行可靠的操作系统检测.有没有一种万无一失的方法来检测运行浏览器的操作系统是MacOSX还是Windows?如果没有,还有什么比用户代理嗅探更好的呢?

推荐答案

当userAgent字符串更改时,window.navigator.platform属性不会被欺骗.

navigator.platform is not spoofed when the userAgent string is changed

房产也是read-only英镑.

导航器.平台是只读的


I could came up with the following table

Mac Computers

Mac68K Macintosh 68K system.
MacPPC Macintosh PowerPC system.
MacIntel Macintosh Intel system.

iOS Devices

iPhone iPhone.
iPod iPod Touch.
iPad iPad.


现代Mac的返回值是navigator.platform == "MacIntel",但为了给出一些"future 的证明",不要使用精确匹配,希望它们在future 会变成MacARMMacQuantum这样的值.

var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;

To include iOS that also use the "left side"

var isMacLike = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var isIOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_OSX = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var is_iOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_Mac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
var is_iPhone = navigator.platform == "iPhone";
var is_iPod = navigator.platform == "iPod";
var is_iPad = navigator.platform == "iPad";

/* Output */
var out = document.getElementById('out');
if (!is_OSX) out.innerHTML += "This NOT a Mac or an iOS Device!";
if (is_Mac) out.innerHTML += "This is a Mac Computer!\n";
if (is_iOS) out.innerHTML += "You're using an iOS Device!\n";
if (is_iPhone) out.innerHTML += "This is an iPhone!";
if (is_iPod) out.innerHTML += "This is an iPod Touch!";
if (is_iPad) out.innerHTML += "This is an iPad!";
out.innerHTML += "\nPlatform: " + navigator.platform;
<pre id="out"></pre>


Since most O.S. use the close button on the right, you can just move the close button to the left when the user is on a MacLike O.S., otherwise isn't a problem if you put it on the most common side, the right.

setTimeout(test, 1000); //delay for demonstration

function test() {

  var mac = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);

  if (mac) {
    document.getElementById('close').classList.add("left");
  }
}
#window {
  position: absolute;
  margin: 1em;
  width: 300px;
  padding: 10px;
  border: 1px solid gray;
  background-color: #DDD;
  text-align: center;
  box-shadow: 0px 1px 3px #000;
}
#close {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 22px;
  height: 22px;
  margin: -12px;
  box-shadow: 0px 1px 3px #000;
  background-color: #000;
  border: 2px solid #FFF;
  border-radius: 22px;
  color: #FFF;
  text-align: center;
  font: 14px"Comic Sans MS", Monaco;
}
#close.left{
  left: 0px;
}
<div id="window">
  <div id="close">x</div>
  <p>Hello!</p>
  <p>If the "close button" change to the left side</p>
  <p>you're on a Mac like system!</p>
</div>

http://www.nczonline.net/blog/2007/12/17/don-t-forget-navigator-platform/

Jquery相关问答推荐

如何根据另一个 radio Select 并切换?

Bootstrap 的工具提示在悬停时将表格单元格向右移动一点

如何确定 jQuery 中匹配元素的元素类型?

在学习 jQuery 之前学习 JavaScript 是个好主意吗?

如何在 jQuery 中获取浏览器滚动位置?

JSLint 消息:未使用的变量

window.onbeforeunload 和 window.onunload 在 Firefox、Safari、Opera 中不起作用?

如何在 Backbone.js - Backbone.sync 或 jQuery.ajax 中保存整个集合?

Chart.js 中饼图的点击事件

如何同时使用 requireJS 和 jQuery?

jQuery 判断 是否存在并且有一个值

当ID包含方括号时按ID查找DOM元素?

试图检测浏览器关闭事件

使用 JQuery / JavaScript 调用/单击 mailto 链接

如何检测 window.print() 完成

jquery: $(window).scrollTop() 但没有 $(window).scrollBottom()

bootstrap 模式:关闭当前,打开新

通过 AJAX MVC 下载 Excel 文件

默认情况下如何将tinymce粘贴为纯文本

Ajax 处理中的无效 JSON 原语