Detect iPad users using jQuery?
iPad Detection
You should be able to detect an iPad user by taking a look at the userAgent
property:
var is_iPad = navigator.userAgent.match(/iPad/i) != null;
iPhone/iPod Detection
Similarly, the platform
property to check for devices like iPhones or iPods:
function is_iPhone_or_iPod(){
return navigator.platform.match(/i(Phone|Pod))/i)
}
Notes
While it works, you should generally avoid performing browser-specific detection as it can often be unreliable (and can be spoofed). It's preferred to use actual feature-detection in most cases, which can be done through a library like Modernizr.
As pointed out in Brennen's answer, issues can arise when performing this detection within the Facebook app. Please see his answer for handling this scenario.
Related Resources
- jQuery HowTo: Detect iPad users using JavaScript
- jQuery HowTo: Detecting & Redirecting iPad / iPhone Users
- David Walsh's Blog : Detecting iPad use
- Detecting iPad use via PHP
Detect iPad in-app browser user agent using JavaScript
You can use this code for ios
var is_safari_or_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit/i.test(navigator.userAgent);
This should work unless they are using their own user agent, you should check it
How to detect iPad Pro as iPad using javascript?
I guess that iPad Pro is upgraded to iPadOS 13 Beta. Since Apple claimed Desktop-Class Browsing with Safari on iPadOS, it seems mobile Safari also mimics macOS behavior and user agent.
So, the short answer is it's not possible.
However you can try workarounds from answers to this question.
How to detect a mobile device using jQuery
Editor's note: user agent detection is not a recommended technique for modern web apps. See the comments below this answer for confirmation of this fact. It is suggested to use one of the other answers using feature detection and/or media queries.
Instead of using jQuery you can use simple JavaScript to detect it:
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
// some code..
}
Or you can combine them both to make it more accessible through jQuery...
$.browser.device = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
Now $.browser
will return "device"
for all above devices
Note: $.browser
removed on jQuery v1.9.1. But you can use this by using jQuery migration plugin Code
A more thorough version:
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;
}
Check if device is an iPad then stop a jQuery function running
Place your navigator.userAgent.match(/iPad/i) != null
within if(....)
statement
if((navigator.userAgent.match(/iPad/i)) && (navigator.userAgent.match(/iPad/i)!= null)){
myFunction.stop();
}
How to Detect ios device using jQuery/JavaScript and hide Bootstrap modal only iPhone and iPad?
Detect iOS devices like:
var iOS will be true or false
var iOS = ['iPad', 'iPhone', 'iPod'].indexOf(navigator.platform) >= 0;
if (iOS)
{
//Hide modal
}
else{
//show modal or do nothing
}
How to detect if user is using an Apple device [Not only iOS] in PHP or Jquery
From Apple’s website:
if (window.ApplePaySession) {
// The Apple Pay JS API is available.
}
After doing that you can also detect if they have a at least one card provisioned using canMakePaymentsWithActiveCard
Related Topics
Create <Div> and Append <Div> Dynamically
Differencebetween Parseint(String) and Number(String) in JavaScript
Is Onload Equal to Readystate==4 in Xmlhttprequest
How to Break/Exit from a Each() Function in Jquery
Jquery Equivalent of JavaScript's Addeventlistener Method
Difference Between Dom Parentnode and Parentelement
In JavaScript, How to Check If an Array Has Duplicate Values
How to Set State of Response from Axios in React
How to Replace Selected Text with HTML in a Contenteditable Element
Rendering React Components from Array of Objects
How to Perform Flood Fill with HTML Canvas
Updating and Merging State Object Using React Usestate() Hook
JavaScript Runtime Complexity of Array Functions
How to Call Fromlatlngtodivpixel in Google Maps API V3
Can You Do Desktop Development Using JavaScript
Regex for Match/Replacing JavaScript Comments (Both Multiline and Inline)
Short-Polling VS Long-Polling for Real Time Web Applications