为了增加额外的控制层，我使用HTML5存储来检测它是使用移动存储还是桌面存储。如果浏览器不支持存储，我有一组移动浏览器名称，并将用户代理与阵列中的浏览器进行比较。

这很简单。功能如下：

// Used to detect whether the users browser is an mobile browser
function isMobile() {
    ///<summary>Detecting whether the browser is a mobile browser or desktop browser</summary>
    ///<returns>A boolean value indicating whether the browser is a mobile browser or not</returns>

    if (sessionStorage.desktop) // desktop storage 
        return false;
    else if (localStorage.mobile) // mobile storage
        return true;

    // alternative
    mobile = ['iphone','ipad','android','blackberry','nokia','opera mini','windows mobile','windows phone','iemobile','tablet','mobi']; 
    var ua=navigator.userAgent.toLowerCase();
    for (var i in mobile) if (ua.indexOf(mobile[i]) > -1) return true;

    // nothing found.. assume desktop
    return false;
}

你需要控制大小

var  is_mobile = false;
        $(window).resize(function() {

            if ($('#mobileNav').css('display') == 'block') {
                is_mobile = true;
            }

            if (is_mobile == true) {

                console.log('is_mobile')
                document.addEventListener(
                    "DOMContentLoaded", () => {
                        new Mmenu("#mainMenu", {
                            "offCanvas": {
                                "position": "right-front"
                            }
                        });
                    }
                );

            }

        }).resize();

这不是jQuery，但我发现了这个：http://detectmobilebrowser.com/

它提供了检测多种语言的移动浏览器的脚本，其中一种是JavaScript。这可能会帮助你找到你想要的东西。

但是，由于您使用的是jQuery，您可能需要了解jQuery.support集合。它是用于检测当前浏览器功能的财产集合。文档位于此处：http://api.jquery.com/jQuery.support/

因为我不知道你到底想做什么，所以我不知道其中哪一个最有用。

尽管如此，我认为最好的选择是使用服务器端语言（如果可以选择的话）重定向或编写不同的脚本到输出。由于您并不真正了解移动浏览器x的功能，因此在服务器端执行检测和更改逻辑将是最可靠的方法。当然，如果您不能使用服务器端语言，所有这些都是一个悬而未决的问题：）

http://www.w3schools.com/jsref/prop_nav_useragent.asp

按平台名称筛选。

Ex:

x = $( window ).width();

platform = navigator.platform;

alert(platform);

if ( (platform != Ipad) || (x < 768) )  {


} 

^^

如果您使用Modernizr，那么很容易使用前面提到的Modernizr.touch。

然而，为了安全起见，我更喜欢使用Moderniz.touch和用户代理测试的组合。

var deviceAgent = navigator.userAgent.toLowerCase();

var isTouchDevice = Modernizr.touch || 
(deviceAgent.match(/(iphone|ipod|ipad)/) ||
deviceAgent.match(/(android)/)  || 
deviceAgent.match(/(iemobile)/) || 
deviceAgent.match(/iphone/i) || 
deviceAgent.match(/ipad/i) || 
deviceAgent.match(/ipod/i) || 
deviceAgent.match(/blackberry/i) || 
deviceAgent.match(/bada/i));

if (isTouchDevice) {
        //Do something touchy
    } else {
        //Can't touch this
    }

如果您不使用Modernizr，您可以简单地将上面的Modernizr.touch函数替换为（document.documentElement中的“ntouchstart”）

还要注意，测试用户代理iemobile将为您提供比Windows Phone更广泛的检测到的Microsoft移动设备。

另请参阅此SO问题

有时，为了显示特定于该设备的内容，需要知道客户使用的是哪个品牌的设备，例如iPhone商店或Android市场的链接。Modernizer非常棒，但它只向您展示浏览器功能，如HTML5或Flash。

以下是我在jQuery中的UserAgent解决方案，为每种设备类型显示不同的类：

/*** sniff the UA of the client and show hidden div's for that device ***/
var customizeForDevice = function(){
    var ua = navigator.userAgent;
    var checker = {
      iphone: ua.match(/(iPhone|iPod|iPad)/),
      blackberry: ua.match(/BlackBerry/),
      android: ua.match(/Android/)
    };
    if (checker.android){
        $('.android-only').show();
    }
    else if (checker.iphone){
        $('.idevice-only').show();
    }
    else if (checker.blackberry){
        $('.berry-only').show();
    }
    else {
        $('.unknown-device').show();
    }
}

此解决方案来自Graphics Maniacshttp://graphicmaniacs.com/note/detecting-iphone-ipod-ipad-android-and-blackberry-browser-with-javascript-and-php/