使用JavaScript或jQuery检测Mac OS X或Windows计算机的最佳方法
alt*_*alt 94 javascript jquery
因此,当用户在Mac上时,我试图将"关闭"按钮移动到左侧,当用户在PC上时,我试图向右移动"关闭"按钮.现在我通过检查用户代理来做到这一点,但是对于可靠的OS检测来说,它太容易被欺骗了.有没有一种可靠的方法来检测运行浏览器的操作系统是Mac OS X还是Windows？如果没有,什么比用户代理嗅探更好？
Vit*_*.us 169
该window.navigator.platform时的userAgent字符串改变没有欺骗性质.我在Mac上测试过如果我将userAgent更改为iPhone或Chrome Windows,navigator.platform仍然是MacIntel.
该物业也是只读的
我想出了下表
Mac电脑
Mac68KMacintosh 68K系统.
MacPPCMacintosh PowerPC系统.
MacIntelMacintosh Intel系统.iOS设备
iPhone苹果手机.
iPodiPod Touch.
iPadiPad兼容.
现代mac返回navigator.platform == "MacIntel"但是为了给出一些"未来证明",不要使用完全匹配,希望它们会改变为类似MacARM或MacQuantum将来的东西.
var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;
包括也使用"左侧"的iOS
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>由于大多数操作系统使用右侧的关闭按钮,因此当用户使用MacLike操作系统时,您可以将关闭按钮向左移动,否则如果将其放在最常见的一侧(右侧)则不会出现问题.
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/
- 它不会被弃用.https://developer.mozilla.org/en-US/docs/Web/API/NavigatorID/platform$history (6认同)
- navigator.platform 已弃用。现在怎么办？ (6认同)
- MacQuantum 让我快乐了一天。 (4认同)
- @ Vitim.us非常感谢你的详细解答,你真的救了我的一天:) (2认同)
Ben*_*uer 43
就这么简单:
function isMacintosh() {
return navigator.platform.indexOf('Mac') > -1
}
function isWindows() {
return navigator.platform.indexOf('Win') > -1
}
你可以做有趣的事情,如:
var isMac = isMacintosh();
var isPC = !isMacintosh();
- 请注意，“navigator.platform”不再是 Web 标准的一部分，因此可能需要进行编辑来解释虽然这在 2015 年有效，但它不再是正确的解决方案。 (10认同)
小智 15
你可以测试一下：
function getOS() {
let userAgent = window.navigator.userAgent.toLowerCase(),
macosPlatforms = /(macintosh|macintel|macppc|mac68k|macos)/i,
windowsPlatforms = /(win32|win64|windows|wince)/i,
iosPlatforms = /(iphone|ipad|ipod)/i,
os = null;
if (macosPlatforms.test(userAgent)) {
os = "macos";
} else if (iosPlatforms.test(userAgent)) {
os = "ios";
} else if (windowsPlatforms.test(userAgent)) {
os = "windows";
} else if (/android/.test(userAgent)) {
os = "android";
} else if (!os && /linux/.test(userAgent)) {
os = "linux";
}
return os;
}
document.getElementById('your-os').textContent = getOS();<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<h1 id="your-os"></h1>
</body>
</html>补充说明：某些浏览器支持navigator.userAgentData.platform，这是一个只读属性。
console.log(navigator.userAgentData.platform);
// macOs
请注意，它Navigator.platform 已被弃用。
正如前面的答案中提到的，navigator.platform 已被弃用。\n我们应该使用 navigator.userAgentData，但它仍然缺乏支持（firefox、safari 在 2022 年不支持它）。
\n请注意，navigator.userAgentData 仅适用于通过 https 的兼容浏览器。
\n这是一个使用 UserAgentData 的脚本，并回退到旧的执行方式。
\nfunction get_platform() {\n // 2022 way of detecting. Note : this userAgentData feature is available only in secure contexts (HTTPS)\n if (typeof navigator.userAgentData !== 'undefined' && navigator.userAgentData != null) {\n return navigator.userAgentData.platform;\n }\n // Deprecated but still works for most of the browser\n if (typeof navigator.platform !== 'undefined') {\n if (typeof navigator.userAgent !== 'undefined' && /android/.test(navigator.userAgent.toLowerCase())) {\n // android device\xe2\x80\x99s navigator.platform is often set as 'linux', so let\xe2\x80\x99s use userAgent for them\n return 'android';\n }\n return navigator.platform;\n }\n return 'unknown';\n}\n\nlet platform = get_platform().toLowerCase();\n\nlet isOSX = /mac/.test(platform); // Mac desktop\nlet isIOS = ['iphone', 'ipad', 'ipod'].indexOf(platform) >= 0; // Mac iOs\nlet isApple = isOSX || isIOS; // Apple device (desktop or iOS)\nlet isWindows = /win/.test(platform); // Windows\nlet isAndroid = /android/.test(platform); // Android\nlet isLinux = /linux/.test(platform); // Linux\n这是你想要的？否则,请告诉我,我将删除此帖.
试试这个jQuery插件:http://archive.plugins.jquery.com/project/client-detect
演示: http ://www.stoimen.com/jquery.client.plugin/
这是基于quirksmode BrowserDetect的jQuery浏览器/ os检测插件的包装.
对于敏锐的读者:
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/jquery.client.plugin/jquery.client.js
- DUDE!我欺骗了我的用户代理,它仍然在Safari for Mac上检测到我!谢谢BRUV. (2认同)
| 归档时间： |
|
| 查看次数： |
80767 次 |
| 最近记录： |