Html 点击调用html

Click to call html

提问by Umair Rana

I want to use html5 tag in my website for mobile view when user click on this link from mobile device it will place a call on the given number..

我想在我的网站中使用 html5 标签进行移动视图，当用户从移动设备点击此链接时，它将拨打给定号码的电话。

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

What should I do to hide this link when user mobile is non html5.. I have gone through modenizer but seems it will not detect the link attribute. http://www.tutorialspoint.com/html5/html5_modernizr.htm

当用户移动设备不是 html5 时，我应该怎么做才能隐藏此链接。我已经通过了修改器，但似乎它不会检测到链接属性。 http://www.tutorialspoint.com/html5/html5_modernizr.htm

Any suggestion? This button will only appear when my website is opened on mobile device and for mobile devices I want to hide this link when opened in old mobile..

有什么建议吗？此按钮仅在我的网站在移动设备上打开时出现，对于移动设备，我想在旧手机中打开时隐藏此链接。

回答by Adriano Repetti

tl;drWhat to do in modern (2018) times? Assume tel:is supported, use it and forget about anything else.

tl;dr在现代（2018）时代该做什么？假设tel:支持，使用它并忘记其他任何事情。

---

---

The tel:URI scheme RFC5431(as well as sms:but also feed:, maps:, youtube:and others) is handled by protocol handlers(as mailto:and http:are).

的tel:URI方案RFC5431（以及sms:也feed:，maps:，youtube:及其他）由处理的协议处理程序（如mailto:和http:是）。

They're unrelated to HTML5 specification(it has been out there from 90sand documented first time back in 2k with RFC2806) then you can't check for their support using tools as modernizr. A protocol handler may be installed by an application (for example Skypeinstalls a callto:protocol handler with same meaning and behaviour of tel:but it's not a standard), natively supported by browser or installed (with some limitations) by website itself.

它们与 HTML5 规范无关（它从 90 年代就已经存在并且第一次用RFC2806记录在 2k 中）然后您无法使用工具检查它们的支持作为modernizr。协议处理程序可以由应用程序安装（例如Skype安装callto:具有相同含义和行为的协议处理程序，tel:但它不是标准），由浏览器本地支持或由网站本身安装（有一些限制）。

What HTML5 added is support for installing custom web based protocol handlers (with registerProtocolHandler()and related functions) simplifying also the check for their support through isProtocolHandlerRegistered()function.

HTML5 添加的是支持安装自定义的基于 Web 的协议处理程序（带有registerProtocolHandler()和相关的功能），通过isProtocolHandlerRegistered()功能也简化了对它们的支持的检查。

There is some easy ways to determine if there is an handler or not:" How to detect browser's protocol handlers?).

有一些简单的方法可以确定是否有处理程序：“如何检测浏览器的协议处理程序？）。

In general what I suggest is:

一般来说，我的建议是：

1. If you're runningon a mobile device then you can safely assume tel:is supported (yes, it's not true for veryold devices but IMO you can ignore them).
2. If JS isn't active then do nothing.
3. If you're running on desktop browsers then you can use one of the techniques in the linked post to determine if it's supported.
4. If tel:isn't supported then change links to use callto:and repeat check desctibed in 3.
5. If tel:and callto:aren't supported (or - in a desktop browser - you can't detect their support) then simply remove that link replacing URL in hrefwith javascript:void(0)and (if number isn't repeated in text span) putting, telephone number in title. Here HTML5 microdata won't help users (just search engines). Note that newer versions of Skype handle both callto:and tel:.

1. 如果您在移动设备上运行，那么您可以放心地假设tel:受支持（是的，对于非常旧的设备而言并非如此，但 IMO 您可以忽略它们）。
2. 如果 JS 不活跃，那么什么都不做。
3. 如果您在桌面浏览器上运行，那么您可以使用链接帖子中的一种技术来确定它是否受支持。
4. 如果tel:不支持，则更改要使用的链接callto:并重复检查3 中描述的检查。
5. 如果不支持tel:和callto:不支持（或者 - 在桌面浏览器中 - 您无法检测到他们的支持），那么只需删除该链接，将 URL 替换href为javascript:void(0)和（如果数字在文本范围内没有重复）将电话号码放入title. 在这里 HTML5 微数据不会帮助用户（只是搜索引擎）。请注意，较新版本的 Skype 可以同时处理callto:和tel:.

Please note that (at least on latest Windows versions) there is always a - fake - registered protocol handler called App Picker(that annoying window that let you choose with which application you want to open an unknown file). This may vanish your tests so if you don't want to handle Windows environment as a special case you can simplify this process as:

请注意（至少在最新的 Windows 版本上）总是有一个假的注册协议处理程序称为App Picker（那个烦人的窗口，让你选择要使用哪个应用程序打开未知文件）。这可能会使您的测试消失，因此如果您不想将 Windows 环境作为特殊情况处理，您可以将此过程简化为：

1. If you're running on a mobile device then assume tel:is supported.
2. If you're running on desktop then replace tel:with callto:.then drop tel:or leave it as is (assuming there are good chances Skype is installed).

1. 如果您在移动设备上运行，则假定tel:受支持。
2. 如果您在桌面上运行 然后替换tel:为callto:.然后删除tel:或保持原样（假设很有可能安装了 Skype）。