jQuery/Javascript 在没有插件的情况下检测操作系统?

Posted

技术标签:

【中文标题】jQuery/Javascript 在没有插件的情况下检测操作系统?【英文标题】:jQuery/Javascript to detect OS without a plugin? 【发布时间】:2011-10-26 01:47:02 【问题描述】:

我正在寻找一种方法来检测下载页面的操作系统,使用 jQuery 或 javascript 来推荐适用于 Mac 和 Windows 的特定文件。我希望在不向我的页面添加另一个插件的情况下做到这一点。

【问题讨论】:

【参考方案1】:

试试:

var os = navigator.platform;

然后根据结果相应地处理 os 变量。

您还可以遍历navigator 对象的每个对象,以帮助您更熟悉这些对象:

<script type="text/javascript">
for(var i in navigator)
    console.log(i+"="+navigator[i]+'<br>');

</script>

【讨论】:

根据developer.mozilla.org,此功能已弃用,不再推荐。【参考方案2】:

纯 JavaScript 可能就是您所需要的。

var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

document.write('Your OS: '+OSName);

正如尼克建议的那样,您也可以使用navigator.platform

【讨论】:

既然存在navigator.platform,为什么还要经历这么多麻烦? 因为navigator.platform 已被弃用。检查developer.mozilla.org/en-US/docs/Web/API/NavigatorID.platform 但是appVersionis deprecated as well?【参考方案3】:

据我所知,platform 是导航器对象上受欺骗程度较低的属性。 您可以使用它来获取布尔值。

var isMac = navigator.platform.toUpperCase().indexOf('MAC')!==-1;
var isWindows = navigator.platform.toUpperCase().indexOf('WIN')!==-1;
var isLinux = navigator.platform.toUpperCase().indexOf('LINUX')!==-1;

如果您需要区分旧 PowerPc 和新 Intel 之间的 Mac。

var isMacPpc=navigator.platform==="MacPPC";
var isMacIntel=navigator.platform==="MacIntel";

https://developer.mozilla.org/en/DOM/window.navigator.platform

【讨论】:

【参考方案4】:

试试:

alert(navigator.appVersion);

这应该会给你一个可以为操作系统解析的字符串。

【讨论】:

【参考方案5】:
<script>

osName = 'Unknown';

function nav(x, y, z) 
    z = z || y;
    if (navigator[x] && navigator[x].indexOf(y) !== -1) 
        osName = z;
    


/*   navigator     value     download  */
nav( "appVersion", "X11",    "UNIX"    );
nav( "appVersion", "Mac",    "MacOS"   );
nav( "appVersion", "Linux"             );
nav( "userAgent",  "Linux"             );
nav( "platform",   "Linux"             );
nav( "appVersion", "Win",    "Windows" );
nav( "userAgent",  "Windows"           );
nav( "platform",   "Win",    "Windows" );
nav( "oscpu",      "Windows"           );

document.getElementById("download"+osName).className = "knownOS";

</script>

确保正确的下载链接易于找到,但不要隐藏其他操作系统链接。人们可能仍然想要那些。

<style>

#downloadUNIX, #downloadMacOS, #downloadLinux, #downloadWindows 
    color:#6D94F2;
    line-height:35px;
    margin:24px 0 24px 0;
    padding:10px;

.knownOS 
    background-color:#F7ECAD !important;
    border:2px solid #E8913A;
    color:#133CC4 !important;
    font-weight:bold;


</style>

还有一些html

<ul>
    <li><a id="downloadUNIX"    href="unix Link Here"   >Download Napster-9000 for UNIX</a></li>
    <li><a id="downloadWindows" href="windows Link Here">Download Napster-9000 for Windows</a></li>
    <li><a id="downloadMacOS"   href="mac os link here" >Download Napster-9000 for OS X</a></li>
    <li><a id="downloadLinux"   href="linux Link Here"  >Download Napster-9000 for Linux</a></li>
</ul>

现在用户可以根据需要禁用或阻止 javascripts。链接仍然存在,而不是使用 Javascript 编写链接,后者需要 javascript 才能工作。

这是一个小提琴

http://jsfiddle.net/7fmJb/

【讨论】:

【参考方案6】:

您可以在文档准备功能中使用此功能。为您的事件添加函数内部代码。

function checkOperatingSystem()

    var  userAgent = navigator.userAgent || navigator.vendor || window.opera;

    //Check mobile device is android
    if (/android/i.test(userAgent)) 
        //Add your Code here
    

    //Check mobile device is ios
    if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) 
        //Add your Code here
    

    //Check device os is Windows (For Laptop and PC)
    if (navigator.appVersion.indexOf("Win")!=-1)
    
        //Add your Code here
    

    //Check device os is MAC (For Laptop and PC)
    if (navigator.appVersion.indexOf("Mac")!=-1)
    
        //Add your Code here
      

【讨论】:

【参考方案7】:

我认为这可能会有所帮助:

navigator.appVersion

尝试在你的 JS 文件中解决它。 例如:

console.log(navigator.appVersion);

您将获得有关操作系统的大部分信息。

【讨论】:

以上是关于jQuery/Javascript 在没有插件的情况下检测操作系统?的主要内容,如果未能解决你的问题,请参考以下文章

WordPress 插件开发 - 如何使用 JQuery / JavaScript?

Angular 6 - 集成 jQuery/JavaScript 文件

复制到 jquery/javascript 中的剪贴板,没有 ipad / iphone 的 flash

使用 jQuery 插件自动格式化结构化数据(电话、日期)(或无法使用原生 JavaScript)

使用 jQuery JavaScript/任何插件推送通知

如何使用Jquery / JavaScript完全删除canvas元素?