Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

href=tel:555 link not working in mobile safari

I'm designing a mobile page and am using the following (standard, I believe) code to make the phone dial a phone number.

<a href="tel:555-1234567" class="call"><img src="graphics/call-icon.gif" alt="call-icon" width="45" height="50"></a>

This works fine in android but Mobile Safari I get the following error:

Cannot Open Page
Safari cannot open the page because the address is invalid

like image 321
Iolo Avatar asked Oct 10 '11 15:10

Iolo


People also ask

Why Tel is not working in HTML?

The issue can be related to a click event handler which might be preventing the default behaviour of the link. For example, return:false in the end of the handler might be preventing this behaviour. Try checking that and remove it. This should fix the problem.

How do you hyperlink a phone number?

Href=tel: creates the call link. This tells the browser how to use the number. “Tel: 123-456-7890 “creates the HTML phone number. The number within the quotes is the number it will call.

What is Tel URL?

The tel URL scheme is used to launch the Phone app on iOS devices and initiate dialing of the specified phone number. When a user taps a telephone link in a webpage, iOS displays an alert asking if the user really wants to dial the phone number and initiates dialing if the user accepts.


4 Answers

Your mark-up is fine, and it works on my iPhone (3GS, running 4.3.5). It doesn't work on the iOS simulator (yep, there's the "Cannot Open Page - Safari cannot open the page because the address is invalid" error), but then I wouldn't expect it to, given that you can't make calls on it (either that or the older version of iOS is at fault).

like image 190
Ben Avatar answered Oct 01 '22 10:10

Ben


In your <head> put:

<meta name="format-detection" content="telephone=yes">

From Safari HTML Reference:

This Enables or disables automatic detection of possible phone numbers in a webpage in Safari on iOS. Syntax Discussion By default, Safari on iOS detects any string formatted like a phone number and makes it a link that calls the number. Specifying telephone=no disables this feature. Availability Available in iOS 1.0 and later. Support Level Apple extension.

like image 26
chown Avatar answered Oct 01 '22 09:10

chown


for a telephone number to work in Safari/iOS you need to format the telephone properly like it would be listed in an old ad.

<a href="tel:1-555-123-4567" class="call">
----- OR -----
<a href="tel:15551234567" class="call">
like image 6
James Williams Avatar answered Oct 01 '22 10:10

James Williams


You may want to add target="_blank" in the hyperlink tag.

It works for me.

Read more about target="_blank" at this link

like image 4
ArchyBean Avatar answered Oct 01 '22 08:10

ArchyBean