用JavaScript或jQuery检测Mac OS X或Windows电脑的最佳方法。

So I'm trying to move a "close" button to the left side when the user is on Mac and the right side when the user is on PC. Now I'm doing it by examining the user agent, but it can be too easily spoofed for reliable OS detection. Is there a surefire way to detect whether the OS on which the browser is running is Mac OS X or Windows? If not, what's better than user agent sniffing?

所以当用户在Mac上时，我试着把“关闭”按钮移到左边，当用户在PC上时移到右边。现在我通过检查用户代理来实现这一点，但是对于可靠的OS检测来说，它太容易被欺骗。是否有一种确定的方法来检测浏览器运行的操作系统是Mac OS X还是Windows?如果没有，还有什么比用户代理嗅探更好的呢?

4 个解决方案

#1

The window.navigator.platform property is not spoofed when the userAgent string is changed. I tested on my Mac if I change the userAgent to iPhone or Chrome Windows, navigator.platform remains MacIntel.

window.navigator。当userAgent字符串被更改时，平台属性不会被欺骗。我在我的Mac上测试如果我把userAgent换成iPhone或者Chrome Windows, navigator。平台仍然MacIntel。

The property is also read-only

属性也是只读的

---

I could came up with the following table

我可以想出下面的表格

Mac Computers

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

Mac68K Macintosh系统68 k。MacPPC Macintosh PowerPC系统。英特尔MacIntel Macintosh系统。

iOS Devices

iPhone iPhone.
iPod iPod Touch.
iPad iPad.

iPhone手机。iPod Touch。iPad的iPad。

---

Modern macs returns navigator.platform == "MacIntel" but to give some "future proof" don't use exact matching, hopefully they will change to something like MacARM or MacQuantum in future.

现代电脑返回导航器。平台== "MacIntel"，但为了提供一些“未来证据”，不要使用精确的匹配，希望它们将来会变成MacARM或MacQuantum之类的东西。

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

To include iOS that also use the "left side"

iOS也使用"左侧"

var isMacLike = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i)?true:false;
var isIOS = navigator.platform.match(/(iPhone|iPod|iPad)/i)?true:false;

var is_OSX = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) ? true : false;
var is_iOS = navigator.platform.match(/(iPhone|iPod|iPad)/i) ? true : false;

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.

由于大多数O.S.都使用右边的close按钮，所以当用户使用MacLike O.S.时，只需将close按钮向左移动即可如果你把它放在最常见的一边——右边，那就没问题了。

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

function test() {

  var mac = navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) ? true : false;

  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/

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

#2

It's as simple as that:

就这么简单:

function isMacintosh() {
  return navigator.platform.indexOf('Mac') > -1
}

function isWindows() {
  return navigator.platform.indexOf('Win') > -1
}

You can do funny things then like:

你可以做一些有趣的事情，比如:

var isMac = isMacintosh();
var isPC = !isMacintosh();

#3

Is this what you are looking for? Otherwise, let me know and I will remove this post.

这就是你要找的吗?否则，让我知道，我将删除这个帖子。

Try this jQuery plugin: http://archive.plugins.jquery.com/project/client-detect

试试这个jQuery插件:http://archive.plugins.jquery.com/project/client- detection

Demo: http://www.stoimen.com/jquery.client.plugin/

演示:http://www.stoimen.com/jquery.client.plugin/

This is based on quirksmode BrowserDetect a wrap for jQuery browser/os detection plugin.

这是基于quirksmode BrowserDetect jQuery浏览器/os检测插件的包装。

For keen readers:
http://www.stoimen.com/blog/2009/07/16/jquery-browser-and-os-detection-plugin/
http://www.quirksmode.org/js/support.html

对读者来说:http://www.stoimen.com/blog/2009/07/16/jquery- browserand - os-detection-plugin/http://www.quirksmode.org/js/support.html。

And more code around the plugin resides here: http://www.stoimen.com/jquery.client.plugin/jquery.client.js

插件周围还有更多的代码:http://www.stoimen.com/jquery.client.plugin/jquery.client.js

#4

Well, Windows and Mac aren't the only platforms out there. I wrote this detect-os component that uses the same techniques and checks for more edge cases, but also for other platforms, such as Linux, Android, iOS...

Windows和Mac并不是唯一的平台。我编写了这个detly -os组件，它使用相同的技术并检查更多的边缘情况，但也适用于其他平台，比如Linux、Android、iOS……

Feel free to import it and use as shown in these examples:

如下列例子所示，请随意导入和使用:

detectOs.isAndroid() => true/false
detectOs.isIos() => true/false
detectOs.isWindows() => true/false
detectOs.isBlackBerry() => true/false
detectOs.isMac() => true/false
detectOs.isLinux() => true/false
detectOs.get() => iOS/Android/Windows/Linux/Mac/BlackBerry/Unknown