JSFiddle - React, Tailwind, and code Playground
HTML
<a title="Call to Order" class="button" href="tel: 1-877-123-4567">Call to Order</a>
JavaScript
jQuery(document.documentElement).on('click', '[href^="tel:"]', function(e){
try{
if( /Android|webOS|iPhone|iPad|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
// Do nothing; This device probably supports making phone calls natively...
} else {
// Extract the phone number.
var phoneNumber = jQuery(this).attr('href').replace('tel:', '').trim();
// Tell the user to call it.
alert("Please call "+phoneNumber);
// Prevent the browser popup about unknown protocol tel:
e.preventDefault();
e.stopPropagation();
}
} catch(e){
console.log("Exception when catching telephone call click!", e);
}
});