Как лучше всего обнаружить мобильное устройство?

Потоки сжатия не смываются (и не могут корректно смываться), пока они не будут закрыты. Вам нужно будет закрыть GZipStream. Говорить, что это не закрыть базовый поток (один из аргументов конструктора), облегчит это.

        //generating data
        int length = 100000;
        byte[] data = new byte[length];
        for (int i = 0; i < length; i++)
        {
            data[i] = System.Convert.ToByte(i % 100 + i % 50);
        }

        byte[] o;
        //serialization into memory stream
        IFormatter formatter = new BinaryFormatter();
        using (var ms = new MemoryStream())
        {
            formatter.Serialize(ms, data);
            ms.Seek(0, SeekOrigin.Begin);

            //GZip zip
            using(MemoryStream compressedStream = new MemoryStream())
            {
                using (var Compress = new GZipStream(compressedStream, CompressionMode.Compress, true))
                {
                    ms.CopyTo(Compress);
                }
                compressedStream.Seek(0, SeekOrigin.Begin);
                //GZip Unzip
                using (MemoryStream uncompressedStream = new MemoryStream())
                {
                    using (var Decompress = new GZipStream(compressedStream, CompressionMode.Decompress, true))
                    {
                        Decompress.CopyTo(uncompressedStream);
                    }
                    uncompressedStream.Seek(0, SeekOrigin.Begin);
                    var oo = formatter.Deserialize(uncompressedStream);
                    o = (byte[])oo;
                }
            }
            //deserialization from memory stream
            //POINT1

        }
        //checking
        Debug.Assert(data.Length == o.Length);
        for (int i = 0; i < data.Length; i++)
            Debug.Assert(data[i] == o[i]);
1514
задан 7 revs, 6 users 57% 24 April 2019 в 12:27
поделиться

40 ответов

Вместо использования jQuery вы можете использовать простой JavaScript для его обнаружения:

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
 // some code..
}

Или вы можете объединить их оба, чтобы сделать его более доступным через jQuery .. .

$.browser.device = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));

Теперь $. Browser будет возвращать «устройство» для всех вышеуказанных устройств

Примечание: $. Browser удален из jQuery v1 .9.1 . Но вы можете использовать это, используя плагин миграции jQuery Код


Более подробная версия:

var isMobile = false; //initiate as false
// device detection
if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent) 
    || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0,4))) { 
    isMobile = true;
}
1941
ответ дан 22 November 2019 в 20:15
поделиться

Это мой код, который я использую в своих проектах:

function isMobile() {
 try {
    if(/Android|webOS|iPhone|iPad|iPod|pocket|psp|kindle|avantgo|blazer|midori|Tablet|Palm|maemo|plucker|phone|BlackBerry|symbian|IEMobile|mobile|ZuneWP7|Windows Phone|Opera Mini/i.test(navigator.userAgent)) {
     return true;
    };
    return false;
 } catch(e){ console.log("Error in isMobile"); return false; }
}
3
ответ дан 2 revs, 2 users 96% 24 April 2019 в 12:27
поделиться

Я попробовал некоторые способы , а затем решил заполнить список вручную и выполнить простую проверку JS. И в конце пользователь должен подтвердить. Потому что некоторые проверки дали ложный положительный или отрицательный.

var isMobile = false;
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Opera Mobile|Kindle|Windows Phone|PSP|AvantGo|Atomic Web Browser|Blazer|Chrome Mobile|Dolphin|Dolfin|Doris|GO Browser|Jasmine|MicroB|Mobile Firefox|Mobile Safari|Mobile Silk|Motorola Internet Browser|NetFront|NineSky|Nokia Web Browser|Obigo|Openwave Mobile Browser|Palm Pre web browser|Polaris|PS Vita browser|Puffin|QQbrowser|SEMC Browser|Skyfire|Tear|TeaShark|UC Browser|uZard Web|wOSBrowser|Yandex.Browser mobile/i.test(navigator.userAgent) && confirm('Are you on a mobile device?')) isMobile = true;

Теперь, если вы хотите использовать jQuery для установки CSS, вы можете сделать следующее:

$(document).ready(function() {
  if (isMobile) $('link[type="text/css"]').attr('href', '/mobile.css');
});

Поскольку границы между мобильными и стационарными устройствами становятся свободными, а мобильные браузеры уже мощные Проверка ширины и подтверждение пользователя, вероятно, будут наилучшими для будущего (при условии, что ширина в некоторых случаях все еще будет важна). Потому что прикосновения уже превращаются в взлеты и падения мышью.

А что касается подвижной подвижности, я предлагаю вам подумать над идеей Йоава Барни :

if(typeof window.orientation !== 'undefined'){...}
.
2
ответ дан 2 revs 24 April 2019 в 12:27
поделиться

Также я рекомендую использовать крошечную библиотеку JavaScript Bowser, да нет. Он основан на navigator.userAgent и достаточно хорошо протестирован для всех браузеров, включая iPhone, Android и т. Д.

https://github.com/ded/bowser

Вы можете просто сказать:

if (bowser.msie && bowser.version <= 6) {
  alert('Hello China');
} else if (bowser.firefox){
  alert('Hello Foxy');
} else if (bowser.chrome){
  alert('Hello Silicon Valley');
} else if (bowser.safari){
  alert('Hello Apple Fan');
} else if(bowser.iphone || bowser.android){
  alert('Hello mobile');
}
2
ответ дан 2 revs, 2 users 94% 24 April 2019 в 12:27
поделиться

Отличный ответ, спасибо. Небольшое улучшение для поддержки Windows Phone и Zune:

if (navigator.userAgent.match(/Android/i) ||
  navigator.userAgent.match(/webOS/i) ||
  navigator.userAgent.match(/iPhone/i) ||
  navigator.userAgent.match(/iPad/i) ||
  navigator.userAgent.match(/iPod/i) ||
  navigator.userAgent.match(/BlackBerry/) ||
  navigator.userAgent.match(/Windows Phone/i) ||
  navigator.userAgent.match(/ZuneWP7/i)
) {
  // some code
  self.location = "top.htm";
}
4
ответ дан 3 revs, 3 users 70% 24 April 2019 в 12:27
поделиться
var device = {
  detect: function(key) {
    if(this['_'+key] === undefined) {
      this['_'+key] = navigator.userAgent.match(new RegExp(key, 'i'));
    }
    return this['_'+key];
  },
  iDevice: function() {
    return this.detect('iPhone') || this.detect('iPod');
  },
  android: function() {
    return this.detect('Android');
  },
  webOS: function() {
    return this.detect('webOS');
  },
  mobile: function() {
    return this.iDevice() || this.android() || this.webOS();
  }
};

Я использовал что-то подобное в прошлом. Это похоже на предыдущий ответ, но технически он более эффективен в том смысле, что он кэширует результат совпадения, особенно если обнаружение используется в анимации, событии прокрутки и т. П.

1
ответ дан Fran 24 April 2019 в 12:27
поделиться

Если под мобильным устройством вы понимаете сенсорное, то вы можете определить его, проверив наличие сенсорных обработчиков:

let deviceType = (('ontouchstart' in window)
                 || (navigator.maxTouchPoints > 0)
                 || (navigator.msMaxTouchPoints > 0)
                 ) ? 'touchable' : 'desktop';

jQuery для него не нужен.

1
ответ дан Daniel Kucal 24 April 2019 в 12:27
поделиться

Я знаю этот старый вопрос, и на него много ответов, но я думаю, что эта функция проста и поможет обнаружить все мобильные, планшетные и компьютерные браузеры, она работает как чудо.

function Device_Type() 
{
    var Return_Device; 
    if(/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|android|iemobile|w3c|acs\-|alav|alca|amoi|audi|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd\-|dang|doco|eric|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg\-c|lg\-d|lg\-g|lge\-|maui|maxo|midp|mits|mmef|mobi|mot\-|moto|mwbp|nec\-|newt|noki|palm|pana|pant|phil|play|port|prox|qwap|sage|sams|sany|sch\-|sec\-|send|seri|sgh\-|shar|sie\-|siem|smal|smar|sony|sph\-|symb|t\-mo|teli|tim\-|tosh|tsm\-|upg1|upsi|vk\-v|voda|wap\-|wapa|wapi|wapp|wapr|webc|winw|winw|xda|xda\-) /i.test(navigator.userAgent))
    {
        if(/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i.test(navigator.userAgent)) 
        {
            Return_Device = 'Tablet';
        }
        else
        {
            Return_Device = 'Mobile';
        }
    }
    else if(/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i.test(navigator.userAgent)) 
    {
        Return_Device = 'Tablet';
    }
    else
    {
        Return_Device = 'Desktop';
    }

    return Return_Device;
}
1
ответ дан 3 revs, 2 users 97% 24 April 2019 в 12:27
поделиться

Я делаю это для своих приложений .NET.

На моей общей _Layout.cshtml странице я добавляю это.

@{
    var isMobileDevice = HttpContext.Current.Request.Browser.IsMobileDevice;
}

<html lang="en" class="@((isMobileDevice)?"ismobiledevice":"")">

Затем, чтобы проверить на любой странице вашего сайта (jQuery):

<script>
var isMobile = $('html').hasClass('ismobiledevice');
</script>
0
ответ дан 2 revs, 2 users 89% 24 April 2019 в 12:27
поделиться

Грубый, но достаточный для ограничения загрузки больших ресурсов, таких как видеофайлы, на телефоны по сравнению с планшетом / рабочим столом - просто ищите небольшую ширину или высоту, чтобы покрыть обе ориентации. Очевидно, что если размер настольного браузера был изменен, приведенный ниже код мог бы ошибочно обнаружить телефон, но этого вполне достаточно для моего случая использования.

Почему 480, bcs, это то, что выглядит правильно, основываясь на информации, которую я нашел о размерах устройства телефона.

if(document.body.clientWidth < 480 || document.body.clientHeight < 480) {
  //this is a mobile device
}
0
ответ дан Ron Royston 24 April 2019 в 12:27
поделиться

Используйте это

if( screen.width <= 480 ) { 
    // is mobile 
}
-4
ответ дан 2 revs, 2 users 75% 24 April 2019 в 12:27
поделиться

Это, кажется, комплексное, современное решение:

https://github.com/matthewhudson/device.js

Он обнаруживает несколько платформ, смартфон против таблеток и ориентации. Он также добавляет классы в тег BODY, поэтому обнаружение происходит только один раз, и вы можете прочитать, на каком устройстве вы работаете, с помощью простой серии функций hasQlass jQuery.

Проверьте это ...

[ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ: я не имею ничего общего с человеком, который написал это.]

1
ответ дан Paolo Mioni 24 April 2019 в 12:27
поделиться

Как насчет mobiledetect.net ?

Другие решения кажутся слишком простыми. Это легкий класс PHP. Он использует строку User-Agent в сочетании с определенными заголовками HTTP для обнаружения мобильной среды. Вы также можете воспользоваться Mobile Detect, используя любые сторонние плагины, доступные для: WordPress, Drupal, Joomla, Magento и т. Д.

4
ответ дан 2 revs, 2 users 73% 24 April 2019 в 12:27
поделиться
<script>
  function checkIsMobile(){
      if(navigator.userAgent.indexOf("Mobile") > 0){
        return true;
      }else{
        return false;
      }
   }
</script>

Если вы зайдете в любой браузер и попытаетесь получить navigator.userAgent, мы получим информацию о браузере примерно так:

Mozilla / 5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit / 537.36 (KHTML, как Gecko) Chrome / 64.0.3282.186 Safari / 537.36

То же самое, если вы делаете в мобильном телефоне, вы получите следующее

Mozilla / 5.0 (Linux; Android) 8.1.0; Pixel Build / OPP6.171019.012) AppleWebKit / 537.36 (KHTML, как Gecko) Chrome / 61.0.3163.98 Mobile Safari / 537.36

Каждый мобильный браузер будет иметь useragent со строкой, содержащей «Мобильный» Так что я использую приведенный выше фрагмент в своем коде, чтобы проверить, является ли текущий пользовательский агент веб / мобильным. На основании результата я буду вносить необходимые изменения.

4
ответ дан 2 revs, 2 users 95% 24 April 2019 в 12:27
поделиться

Для меня маленький - это красиво, поэтому я использую эту технику:

В файле CSS:

/* Smartphones ----------- */
@media only screen and (max-width: 760px) {
  #some-element { display: none; }
}

В файле jQuery / JavaScript:

$( document ).ready(function() {      
    var is_mobile = false;

    if( $('#some-element').css('display')=='none') {
        is_mobile = true;       
    }

    // now i can use is_mobile to run javascript conditionally

    if (is_mobile == true) {
        //Conditional script here
    }
 });

Моей целью было сделать мой сайт «мобильным». Поэтому я использую CSS Media Queries для отображения / скрытия элементов в зависимости от размера экрана.

Например, в моей мобильной версии я не хочу активировать Facebook Like Box, потому что он загружает все эти изображения профиля и прочее. И это не хорошо для мобильных посетителей. Итак, помимо скрытия элемента контейнера, я также делаю это внутри блока кода jQuery (см. Выше):

if(!is_mobile) {
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/pt_PT/all.js#xfbml=1&appId=210731252294735";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
}

Вы можете увидеть его в действии на http://lisboaautentica.com

Я все еще работаю над мобильной версией, поэтому она все еще не выглядит так, как следует, на момент написания этого.

Обновление от dekin88

Для обнаружения мультимедиа встроен JavaScript API. Вместо того, чтобы использовать вышеупомянутое решение, просто используйте следующее:

$( document ).ready(function() {      
    var isMobile = window.matchMedia("only screen and (max-width: 760px)").matches;

    if (isMobile) {
        //Conditional script here
    }
 });

Поддержка браузеров: http://caniuse.com/#feat=matchmedia

Преимущество этого метода заключается в том, что он не только проще и короче, но также может условно нацеливаться на разные устройства, такие как смартфоны и планшеты, отдельно, если это необходимо, без добавления каких-либо фиктивных элементов в DOM.

483
ответ дан 9 revs, 9 users 66% 24 April 2019 в 12:27
поделиться

В соответствии с Mozilla - Обнаружение браузера с помощью пользовательского агента :

Итак, мы рекомендуем искать строку «Mobi» в любом месте пользовательского агента для обнаружения мобильного телефона. устройство.

Например:

if (/Mobi/.test(navigator.userAgent)) {
    // mobile!
}

Это будет соответствовать всем распространенным пользовательским агентам мобильных браузеров, включая мобильные Mozilla, Safari, IE, Opera, Chrome и т. Д.

Обновление для Android

EricL рекомендует также тестировать Android как пользовательский агент, так как строка пользовательского агента Chrome для планшетов не включает «Mobi». "(однако версии для телефонов):

if (/Mobi|Android/i.test(navigator.userAgent)) {
    // mobile!
}
211
ответ дан 5 revs, 2 users 94% 24 April 2019 в 12:27
поделиться

Простой и эффективный однострочный:

function isMobile() { return ('ontouchstart' in document.documentElement); }

Однако приведенный выше код не учитывает случай для ноутбуков с сенсорным экраном. Таким образом, я предоставляю эту вторую версию, основанную на решении @Julian :

function isMobile() {
  try{ document.createEvent("TouchEvent"); return true; }
  catch(e){ return false; }
}
81
ответ дан 4 revs, 2 users 72% 24 April 2019 в 12:27
поделиться

То, что вы делаете, пытаясь обнаружить мобильное устройство, слишком близко приближается к концепции IMO «анализ кода браузера». Скорее всего, было бы намного лучше определить некоторые функции. Такие библиотеки, как http://www.modernizr.com/ , могут помочь с этим.

Например, где проходит граница между мобильным и немобильным? С каждым днем ​​оно становится все более размытым.

79
ответ дан Bart 24 April 2019 в 12:27
поделиться

Это не jQuery, но я нашел это: http://detectmobilebrowser.com/

Он предоставляет скрипты для обнаружения мобильных браузеров на нескольких языках, одним из которых является JavaScript. Это может помочь вам с тем, что вы ищете.

Однако, так как вы используете jQuery, вам может потребоваться информация о коллекции jQuery.support. Это набор свойств для определения возможностей текущего браузера. Документация здесь: http://api.jquery.com/jQuery.support/

Поскольку я не знаю, что именно вы пытаетесь сделать, я не знаю знать, какой из них будет наиболее полезным.

После всего этого, я думаю, что вам лучше всего либо перенаправить, либо написать другой скрипт для вывода, используя язык на стороне сервера (если это вариант). Поскольку вы на самом деле не знаете возможностей мобильного браузера x, выполнение логики обнаружения и изменения на стороне сервера будет наиболее надежным методом. Конечно, все это спорный вопрос, если вы не можете использовать язык на стороне сервера:)

64
ответ дан 2 revs, 2 users 84% 24 April 2019 в 12:27
поделиться

Иногда желательно знать, какое устройство бренда использует клиент, чтобы показывать контент, относящийся к этому устройству, например, ссылку на магазин iPhone или на рынок Android. Модернизатор хорош, но показывает только возможности браузера, такие как HTML5 или Flash.

Вот мое решение UserAgent в jQuery для отображения разных классов для каждого типа устройства:

/*** 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();
    }
}

Это решение от графических маньяков http://graphicmaniacs.com/note/detecting- iphone-ставка-IPAD-андроид-и-ежевика-браузер с JavaScript-и-PHP-/

46
ответ дан 2 revs, 2 users 97% 24 April 2019 в 12:27
поделиться

Нашли решение в: http://www.abeautifulsite.net/blog/2011/11/detecting-mobile-devices-with-javascript/ .

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

А затем, чтобы проверить, является ли это Mobile, вы можете проверить, используя:

if(isMobile.any()) {
   //some code...
}
43
ответ дан Gabriel 24 April 2019 в 12:27
поделиться

Если под «мобильным» вы подразумеваете «маленький экран», я использую это:

var windowWidth = window.screen.width < window.outerWidth ?
                  window.screen.width : window.outerWidth;
var mobile = windowWidth < 500;

На iPhone вы получите window.screen.width 320. На Android вы в конечном итоге с window.outerWidth 480 (хотя это может зависеть от Android). iPad и планшеты Android будут возвращать цифры, например, 768, поэтому они получат полный обзор, как вам нужно.

22
ответ дан Chris Moschini 24 April 2019 в 12:27
поделиться

Если вы используете Modernizr , очень просто использовать Modernizr.touch, как упоминалось ранее.

Однако я предпочитаю использовать комбинацию Modernizr.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 на ('ontouchstart' in document.documentElement)

Также обратите внимание, что тестирование пользовательского агента iemobile даст вам более широкий диапазон обнаружил мобильные устройства Microsoft, чем Windows Phone.

Также см. Этот вопрос SO

15
ответ дан 2 revs 24 April 2019 в 12:27
поделиться

Вы не можете положиться на navigator.userAgent, не каждое устройство показывает свою настоящую ОС. На моем HTC например это зависит от настроек ("использование мобильной версии" вкл / выкл). На http://my.clockodo.com мы просто использовали screen.width для обнаружения небольших устройств. К сожалению, в некоторых версиях Android есть ошибка с screen.width. Вы можете комбинировать этот способ с userAgent:

if(screen.width < 500 ||
 navigator.userAgent.match(/Android/i) ||
 navigator.userAgent.match(/webOS/i) ||
 navigator.userAgent.match(/iPhone/i) ||
 navigator.userAgent.match(/iPod/i)) {
alert("This is a mobile device");
}
13
ответ дан 3 revs, 3 users 87% 24 April 2019 в 12:27
поделиться

Вы можете использовать медиазапрос, чтобы иметь возможность легко с ним справиться.

isMobile = function(){
    var isMobile = window.matchMedia("only screen and (max-width: 760px)");
    return isMobile.matches ? true : false
}
5
ответ дан vin 24 April 2019 в 12:27
поделиться

Если вы не особенно беспокоитесь о маленьких дисплеях, вы можете использовать определение ширины / высоты. Таким образом, если ширина меньше определенного размера, мобильный сайт перебрасывается. Возможно, это не идеальный способ, но, вероятно, его будет проще всего обнаружить на нескольких устройствах. Возможно, вам придется вставить конкретный для iPhone 4 (большое разрешение).

11
ответ дан MoDFoX 24 April 2019 в 12:27
поделиться

Я знаю, что на этот вопрос есть много ответов, но из того, что я увидел, никто не подходит к ответу так, как я бы решил.

CSS использует width (Media Queries), чтобы определить, какие стили применяются к веб-документу на основе ширины. Почему бы не использовать ширину в JavaScript?

Например, в медиазапросах Bootstrap (Mobile First) существует 4 точки привязки / перерыва:

  • Дополнительные малые устройства имеют размер 768 пикселей и меньше .
  • Малые устройства варьируются от 768 до 991 пикселей.
  • Средние устройства имеют диапазон от 992 до 1199 пикселей.
  • Большие устройства имеют 1200 пикселей и выше.

Мы также можем использовать это для решения нашей проблемы с JavaScript.

Сначала мы создадим функцию, которая получает размер окна и возвращает значение, которое позволяет нам увидеть, какое устройство размера просматривает наше приложение:

var getBrowserWidth = function(){
    if(window.innerWidth < 768){
        // Extra Small Device
        return "xs";
    } else if(window.innerWidth < 991){
        // Small Device
        return "sm"
    } else if(window.innerWidth < 1199){
        // Medium Device
        return "md"
    } else {
        // Large Device
        return "lg"
    }
};

Теперь, когда мы настроили функцию, мы Можно назвать его и сохранить значение:

var device = getBrowserWidth();

Ваш вопрос был

Я хотел бы запустить другой скрипт, если браузер установлен на портативном устройстве.

Теперь, когда у нас есть информация об устройстве, остается только оператор if:

if(device === "xs"){
  // Enter your script for handheld devices here 
}

Вот пример для CodePen: http://codepen.io/jacob -king / ручка / jWEeWG

13
ответ дан 2 revs, 2 users 97% 24 April 2019 в 12:27
поделиться

Я удивлен, что никто не указал на хороший сайт: http://detectmobilebrowsers.com/ Он имеет готовый код на разных языках для мобильного обнаружения (включая, но не ограничиваясь):

  • Apache
  • ASP
  • C #
  • IIS
  • JavaScript
  • NGINX
  • PHP
  • Perl
  • Python
  • Rails

И если вам нужно также обнаружить планшеты, просто проверьте раздел About для дополнительного параметра RegEx.

Планшеты Android, планшеты iPad, Kindle Fires и PlayBook не определяются дизайном. Чтобы добавить поддержку для планшетов, добавьте |android|ipad|playbook|silk к первому регулярному выражению.

11
ответ дан 4 revs, 2 users 88% 24 April 2019 в 12:27
поделиться

Чтобы добавить дополнительный уровень контроля, я использую хранилище 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;
}
9
ответ дан 2 revs, 2 users 93% 24 April 2019 в 12:27
поделиться

Советую проверить http://wurfl.io/

В двух словах, если вы импортируете крошечный файл JavaScript:

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

Вы останется объект JSON, который выглядит следующим образом:

{
 "complete_device_name":"Google Nexus 7",
 "is_mobile":true,
 "form_factor":"Tablet"
}

(конечно, при условии, что вы используете Nexus 7), и вы сможете делать такие вещи, как:

if(WURFL.is_mobile) {
    //dostuff();
}

Это то, что вы ищете.

Отказ от ответственности: я работаю в компании, которая предлагает эту бесплатную услугу.

7
ответ дан 4 revs, 3 users 90% 24 April 2019 в 12:27
поделиться
Другие вопросы по тегам:

Похожие вопросы: