Нажмите, чтобы позвонить html

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

<p>Book now, call <a href="tel:01234567890">01234 567 890</a></p>

Что мне делать, чтобы скрыть эту ссылку, когда пользовательский мобильный телефон не является html5.. Я прошел через modenizer, но, похоже, он не обнаружит атрибут ссылки. http://www.tutorialspoint.com/html5/html5_modernizr.htm

Любое предложение? Эта кнопка появится только при открытии моего веб-сайта на мобильном устройстве и мобильных устройствах. Я хочу скрыть эту ссылку при открытии на старом мобильном телефоне.

Ответ 1

Схема tel: URI (а также sms:, но также feed:, maps:, youtube: и другие ) обрабатывается обработчиками протоколов (как mailto: и http:).

Они не связаны с спецификацией HTML5 (AFAIK Apple представила поддержку tel: в 2007 году, а также Android-устройства, поддерживающие их с давних времен), тогда вы не можете проверьте их поддержку, используя инструменты как модернизацию. Обработчик протокола может быть установлен приложением (например, Skype устанавливает обработчик протокола callto: с тем же значением и поведением tel:), поддерживаемый браузером или установленный (с некоторыми ограничениями) сам по себе веб-сайт.

В HTML5 добавлена поддержка для установки пользовательских обработчиков протоколов через Интернет (с registerProtocolHandler() и сопутствующих функций), упрощающих проверку их поддержки через функцию isProtocolHandlerRegistered().

Есть несколько простых способов определить, есть ли обработчик или нет: "Как обнаружить обработчики протокола браузера?).

В общем, я предлагаю:

Если вы работаете на мобильном устройстве, вы можете с уверенностью предположить, что поддерживается tel: (да, это не так для старых устройств очень, но IMO вы можете их игнорировать).
Если JS не активен, ничего не делайте.
Если вы работаете в настольных браузерах, вы можете использовать один из методов в связанной записи, чтобы определить, поддерживается ли она.
Если tel: не поддерживается, измените ссылки на использование callto: и повторите проверку по 3.
Если tel: и callto: не поддерживаются (или - в обозревателе рабочего стола - вы не можете определить их поддержку), просто удалите ссылку, заменяющую URL-адрес в href, с помощью javascript:void(0) и (если номер не повторяется в тексте), номер телефона в title. Здесь микроданные HTML5 не помогут пользователям (просто поисковым системам). Обратите внимание, что более новые версии Skype обрабатывают как callto:, так и tel:.

Обратите внимание, что (по крайней мере, на последних версиях Windows) всегда существует обработчик протокола Fake, который называется App Picker (это раздражающее окно, которое позволяет вам выбрать, с каким приложением вы хотите открыть неизвестный файл). Это может привести к исчезновению ваших тестов, поэтому, если вы не хотите обрабатывать среду Windows в качестве специального случая, вы можете упростить этот процесс как:

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