What is the code to detect touch devices (smartphones and tablets) vs desktops browsers using userAgent.match and return a boolean variable (for example 'isipad')?

I need to test this against Android and Apple devices mainly. If the device browser is Android or Apple, return isipad = false. Else, return isipad = true.

So far I went about it like this (for iDevice browser detection) :

if( navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) ||navigator.userAgent.match(/iPad/i) )
{var isipad = true;}
else
{var isipad = false;}

It seems to work, however I would love to be able to add the android browser as well, in this case.

Thanks in advance. Alex

What is the code to detect touch devices (smartphones and tablets) vs desktops browsers using userAgent.match and return a boolean variable (for example 'isipad')?

I need to test this against Android and Apple devices mainly. If the device browser is Android or Apple, return isipad = false. Else, return isipad = true.

So far I went about it like this (for iDevice browser detection) :

if( navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) ||navigator.userAgent.match(/iPad/i) )
{var isipad = true;}
else
{var isipad = false;}

It seems to work, however I would love to be able to add the android browser as well, in this case.

Thanks in advance. Alex

• javascript
• user-agent
• browser-detection
• device-detection

4 Answers 4

if ("ontouchstart" in document.documentElement)
{
  alert("It's a touch screen device.");
}
else
{
 alert("Others devices");
}

most simple code i found after browsing a lot here and there

You really should not try to figure out what type of device it is. Instead, you should examine the capabilities of the host device and have your code adapt to the capabilities it finds regardless of what type of device it is. This is called "feature detection" and is considered a much better way to do things than detecting a particular browser or device.

For example, when Windows 8 tablets e out, there will be devices with both mouse and touch.

There are lots written on how to detect touch capabilities. See these for ideas:

http://alastairc.ac/2010/03/detecting-touch-based-browsing/

Optimize website for touch devices

https://stackoverflow./a/4819886/816620

Although I agree with @jfriend00 that you should use "feature detection" rather than using the user agent, but it sounds like the user agent is your only option. I use this web site for mobile browser detection. They frequently update their code based on new devices, so update yours occasionaly. Here is the JS code:

(function(a,b){if(/android.+mobile|avantgo|bada\/|blackberry|blazer|pal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|meego.+mobile|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(a)||/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(di|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(a.substr(0,4)))window.location=b})(navigator.userAgent||navigator.vendor||window.opera,'http://detectmobilebrowser./mobile');

Here is a fiddle of it in action.

I've tested up against detectmobilebrowsers. with and iPad mini and a Surface-tablet, and both of them returned ”No mobile browser detected”.

The strangest part about that was, that the User-Agent string for iPad mini actually contains the word "Mobile", which would suggest that it wouldn't be so difficult to determine as a mobile device.