CODEWITHSUNDEEP
javascriptgoogle-mapsios6ios6-maps
Shawn Taylor
Shawn Taylor

Reputation: 15730

How can I detect specific iOS version with jquery?

So that mapping links open the maps app like they used to, I want to present a different link depending on whether a user is on iOS 6 or other (iOS 4, 5, Android, whatever).

Something like: -- if on iOS 6.0 or higher, show http://maps.apple.com?q="address", if other, show http://maps.google.com?q="address".

NOTE: I realize you can also call the maps app directly as opposed to via a web link (don't have it handy right now), but that would not fix the issue, since someone on Android or lesser iOS would get no use from that.

Upvotes: 10

Views: 18431

Answers (4)

Jim Bergman
Jim Bergman

Reputation: 5237

Here's a bit of JS to determine iOS and Android OS version. No jQuery required.

Tested with actual user agent strings for iOS 4.3 to 6.0.1, and Android 2.3.4 to 4.2

var userOS;    // will either be iOS, Android or unknown
var userOSver; // this is a string, use Number(userOSver) to convert

function getOS( )
{
  var ua = navigator.userAgent;
  var uaindex;

  // determine OS
  if ( ua.match(/iPad/i) || ua.match(/iPod/i) || ua.match(/iPhone/i) )
  {
    userOS = 'iOS';
    uaindex = ua.indexOf( 'OS ' );
  }
  else if ( ua.match(/Android/i) )
  {
    userOS = 'Android';
    uaindex = ua.indexOf( 'Android ' );
  }
  else
  {
    userOS = 'unknown';
  }

  // determine version
  if ( userOS === 'iOS'  &&  uaindex > -1 )
  {
    userOSver = ua.substr( uaindex + 3, 3 ).replace( '_', '.' );
  }
  else if ( userOS === 'Android'  &&  uaindex > -1 )
  {
    userOSver = ua.substr( uaindex + 8, 3 );
  }
  else
  {
    userOSver = 'unknown';
  }
}

Then to detect a specific version and higher, try:

if ( userOS === 'iOS' && Number( userOSver.charAt(0) ) >= 5 ) { ... }

Upvotes: 7

David Hellsing
David Hellsing

Reputation: 108480

You can detect iOS version using the navigator.userAgentstring. Something like:

if(/(iPhone|iPad|iPod)\sOS\s6/.test(navigator.userAgent)) {
    // use apple maps
}

Note that this is in no way future proof, user agent strings can change, and so will the OS. Also AFAIK, google maps via the browser is available on all platforms, including iOS 6.

Upvotes: 16

sainiuc
sainiuc

Reputation: 1697

Use JavaScript to look at the user agent header.

navigator.userAgent

Upvotes: 1

aug
aug

Reputation: 11714

You want to look into the user-agent string. The Safari web browser has a way of reporting what device (iPad, iPhone, etc) is being used and also the version number so its a matter of indexOf the information in that compact little string.

http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/OptimizingforSafarioniPhone/OptimizingforSafarioniPhone.html#//apple_ref/doc/uid/TP40006517-SW3

Some other helpful/very related Stackoverflow questions:

Detect iOS version less than 5 with JavaScript

Detecting iOS Version on a Web Page

Check if iOS version is 3.0 or higher with PHP or Javascript

Upvotes: 2

Related Questions