web移动端实现打电话和保存到电话簿功能

版权声明：本文为博主原创文章，转载请注明出处。 https://blog.csdn.net/weixin_44198965/article/details/91386857

前言

在web移动端开发中，做产品页面时可能需要一个a标签来链接一个联系方式（电话号/座机号等），也可能会是一个侧边悬浮的电话小图标，无论怎么展示，我们都希望每当用户点击时，直接通过网页输好手机号并引导用户拨打给我们。而不希望输入手机号的工作由用户来完成。

tel直接写入(推荐)

<a href="tel://13191835108"> 
	点击联系我们
</a>

通过tel写入的电话/座机，无论是在安卓/苹果手机浏览器（在QQ浏览器下支持不是很好）都能非常好的渲染出来，需要注意的是，相同的代码在安卓/苹果下显示的结果是不同的，这也是老生常谈的 “兼容性” 问题。

Wtai直接写入

使用Wtai（Wireless Telephony Applications Interface）协议直接写入电话号码。

<a href="wtai://wp/mc;13191835108">
	点击联系我们
</a>

以上代码，通过Wtai协议，也实现了拨打电话。
Wtai协议正在逐渐被支持，大部分浏览器都支持它。

Wtai将号码保存到电话簿

<a href="wtai://wp/ap;13191835108;">
	存储在电话簿
</a>

自动探测可能的电话号码

<meta name="format-detection" content="telephone=no">
<meta http-equiv="x-rim-auto-match" content="none">

通过自己封装函数，来打造不一样的拨打方法也是不错的，但一定要格外注意浏览器兼容问题。