Как вызвать телефонный звонок при нажатии на ссылку на веб-странице на мобильном телефоне


493

Мне нужно создать веб-страницу для мобильных устройств. Есть только одна вещь, которую я до сих пор не понял: как я могу вызвать телефонный звонок с помощью щелчка текста?

Могу ли я ввести специальный URL-адрес, например, mailto:тег для электронных писем?

Специфичное для устройства решение не является предпочтительным.

Я знаю, что iPhone автоматически распознает телефонные номера и создает ссылку для этого, но было бы здорово, если бы это можно было сделать и для изображений ... а также для большинства мобильных устройств.

Ответы:


868

Большинство современных устройств поддерживают схему tel :. Так что пользуйтесь <a href="tel:555-555-5555">555-555-5555</a>и вам должно быть хорошо идти.

Если вы хотите использовать его для изображения, <a>тег может обрабатывать <img/>помещенное в него изображение так же, как и в других обычных ситуациях:<a href="tel:555-555-5555"><img src="path/to/phone/icon.jpg" /></a>


12
Как это понизить для настольного компьютера? Вы, очевидно, не хотите, чтобы это передавало ссылку на десктопы, верно? Или мне нужно в браузере понюхать и убить вмещающий тег?
3Dom

9
@ 3Dom Попробуй. Он запускает или запрашивает вашу телефонную программу.
Сис Тиммерман

1
@ 3Dom Нет проблем в настольном Aurora 29.0a2 (2014-02-07). Вы можете использовать ссылку на изображение, чтобы позвонить (см. Ответ Эндрю), и номер рядом с ним в виде простого текста.
Сис Тиммерман

2
Для дальнейшего использования: на OS X Yosemite и выше это запустит приложение Facetime и, если у пользователя есть iPhone, позволяет ему фактически звонить со своего настольного компьютера / ноутбука.
Джефф Хейсманс

8
Здравствуйте, не забудьте поставить знак плюс и код страны следующим образом: + 1-555-555-5555, если вы используете Skype, это необходимо для мгновенного набора.
Самуэль Рамзан

59

Правильная схема URL - это тел: [число], так что вы бы сделали

<a href="tel:5551234567"><img src="callme.jpg" /></a>

45

Хочу добавить ответ здесь для полноты картины.

<a href="tel:1234567">Call 123-4567</a>

Работает просто отлично на большинстве устройств. Однако на настольных компьютерах это будет отображаться как ссылка, которая ничего не делает при нажатии на нее, поэтому вам следует рассмотреть возможность использования CSS, чтобы сделать ее условно видимой только на мобильных устройствах.

Кроме того, вы должны знать, что Skype (который довольно популярен) по умолчанию использует другой синтаксис (но может быть параметрирован для использования tel :).

<a href="callto:1234567">Call 123-4567</a>

Тем не менее, я думаю, что в последних мобильных браузерах (я точно знаю, на Android) теперь telсинтаксис должен предлагать всплывающее окно доступных приложений, которые можно использовать для завершения действия вызова.


бы знать о том, как открыть общий доступ в Android для URL?
свист

@ whizcreed извините, братан, не моя область.
vvohra87

4
Работает ли протокол "tel" со Skype или только их протокол "callto"?
Хатч Мур

@HutchMooreМожно связать префикс "tel:" со Skype. В параметрах Skype есть опция (рядом с опцией, позволяющей инициировать звонки с префиксом "callto:".
salcoin

21

Кликабельный код ссылки на смартфон:

Следующая ссылка может быть использована для создания интерактивной ссылки телефона. Вы можете скопировать приведенный ниже код и вставить его на свою веб-страницу, а затем отредактировать под своим номером телефона. Этот код может работать не на всех телефонах, но работает на iPhone, Droid / Android и Blackberry.

<a href="tel:1-847-555-5555">1-847-555-5555</a>

Ссылки на телефонные номера можно использовать с тире, как показано выше, или без них, а также в следующем примере:

<a href="tel:18475555555">1-847-555-5555</a>

Также можно использовать любой текст в ссылке, если номер телефона настроен с помощью «tel: 18475555555», как в этом примере:

<a href="tel:18475555555">Click Here To Call Support 1-847-555-5555</a>

Ниже кликабельна телефонная гиперссылка, которую вы можете проверить. В большинстве браузеров, не являющихся телефонами, эта ссылка приведет к ошибке «Веб-страница не может быть отображена», иначе ничего не произойдет.

ПРИМЕЧАНИЕ . Браузер iPhone Safari автоматически обнаружит номер телефона на странице и преобразует текст в ссылку для вызова, не используя какой-либо код на этой странице.

Код ссылки смартфона WTAI: Код ссылки WTAI или «Интерфейс приложения беспроводной телефонии» показан ниже. Этот код считается правильным протоколом мобильного телефона и будет работать на смартфонах, таких как Droid, однако он может не работать для Apple Safari на iPhone, поэтому рекомендуется использовать приведенный выше код.

<a href="wtai://wp/mc;18475555555">Click Here To Call Support 1-847-555-5555</a> 

3

По сути, используйте <a>элемент с hrefattr, указывающим на номер телефона с префиксом tel:. Обратите внимание, что плюсы могут использоваться для указания кода страны, а дефисы могут быть включены просто для человеческого глаза.

MDN Web Docs

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Creating_a_phone_link

HTML <a>элемент (или анкерный элемент), вместе с атрибутом HREF, создает гиперссылку на другие веб - страницы, файлы, места в пределах одной и той же страницы, адреса электронной почты или любой другой URL.

[...]

Предоставление телефонных ссылок полезно для пользователей, просматривающих веб-документы и ноутбуки, подключенные к телефонам.

<a href="tel:+491570156">+49 157 0156</a>

Документы IETF

https://tools.ietf.org/html/rfc3966

telURI для телефонных номеров

URI "tel" имеет следующий синтаксис:

telephone-uri = "tel:"телефон-абонент

[...]

Примеры

tel:+1-201-555-0123: Этот URI указывает на номер телефона в Соединенных Штатах. Включены дефисы, чтобы сделать число более читабельным; они разделяют страну, код города и номер абонента.

tel:7042;phone-context=example.com: URI описывает местный номер телефона, действительный в контексте «example.com».

tel:863-1234;phone-context=+1-914-555: URI описывает местный номер телефона, который действителен в пределах определенного телефонного префикса.


0

Просто используйте HTML-тег привязки <a>и начните атрибут hrefс tel:. Предлагаю начать номер телефона с кода страны. обратите внимание на следующий пример:

<a href="tel:+989123456789">NO Different What it is</a>

Для этого примера код страны +98.

Подсказка : он очень подходит для мобильных телефонов, я знаюtel:префиксные звонкиFaceTimeв macOS, но в Windows я не уверен, но думаю, это вызвало запуск Skype.

Для получения дополнительной информации : вы можете посетить список схем URL, поддерживаемых браузерами, чтобы узнать все hrefпрефиксы значений.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.