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

前言

在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">

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值