H5唤起手机打电话(拨号)和发短信功能

简介: H5唤起手机打电话(拨号)和发短信功能


在移动端页面,有时候我们需要唤起用户手机的打电话功能,拨打客服电话,以及发送短信功能,此时我们可以按照以下操作实现打电话和发短信功能

拨打电话

  • index.html在<head></head>中加入这一段
<meta name="format-detection" content="telephone=yes"/>
  • js
window.location.href = 'tel:4000-000-000';
  • 或者
<a href="tel:4000-000-000">拨打电话</a>

发送短信

  • index.html在<head></head>中加入这一段
<meta name="format-detection" content="telephone=yes"/>
  • js
// 添加内容
window.location.href = 'sms:10086?body=短信内容';
// 不添加内容
window.location.href = 'sms:10086';
  • 或者
<a href="sms:10086">发送短信</a>
<a href="sms:10086?body=短信内容"></a>

移动web页面自动探测电话号码

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

使用wtai协议进行拨打电话

<a href="wtai://wp//mc;10086">拨打10086 </a>  
<a href="wtai://wp/ap;10086;">存储</a>

关于微信页面出现屏蔽的情况,采用以下解决方案

解决方法如下:

1、拨号的代码还是不变,和原先的一样,

2、打开拨号页面要做下处理,在网址后面增加一个锚节点mp.weixin.qq.com。

实例如下:

如:<a href=“tel:10086”>一键拨号</a> 上需要拨号代码,操作如下

在有这个代码的页面URl后边加上“#mp.weixin.qq.com” 如:tel:10086#mp.weixin.qq.com

文章参考:https://segmentfault.com/q/1010000002648066

目录
相关文章
|
2月前
Discuz! X3.5插件云诺-阿里云短信手机登录 会员登录后也无法查看附件图片的问题解决方法
Discuz! X3.5插件云诺-阿里云短信手机登录 会员登录后也无法查看附件图片的问题解决方法
39 2
|
2月前
|
SQL 存储 数据可视化
手机短信SQL分析技巧与方法
在手机短信应用中,SQL分析扮演着至关重要的角色
|
6月前
|
存储 小程序 前端开发
【微信小程序 - 工作实战分享】1.微信小程序发送手机短信验证码(阿里云)
【微信小程序 - 工作实战分享】1.微信小程序发送手机短信验证码(阿里云)
528 0
|
3月前
|
移动开发 Android开发 数据安全/隐私保护
移动应用与系统的技术演进:从开发到操作系统的全景解析随着智能手机和平板电脑的普及,移动应用(App)已成为人们日常生活中不可或缺的一部分。无论是社交、娱乐、购物还是办公,移动应用都扮演着重要的角色。而支撑这些应用运行的,正是功能强大且复杂的移动操作系统。本文将深入探讨移动应用的开发过程及其背后的操作系统机制,揭示这一领域的技术演进。
本文旨在提供关于移动应用与系统技术的全面概述,涵盖移动应用的开发生命周期、主要移动操作系统的特点以及它们之间的竞争关系。我们将探讨如何高效地开发移动应用,并分析iOS和Android两大主流操作系统的技术优势与局限。同时,本文还将讨论跨平台解决方案的兴起及其对移动开发领域的影响。通过这篇技术性文章,读者将获得对移动应用开发及操作系统深层理解的钥匙。
101 12
|
5月前
|
缓存 开发框架 前端开发
循序渐进VUE+Element 前端应用开发(32)--- 手机短信动态码登陆处理
循序渐进VUE+Element 前端应用开发(32)--- 手机短信动态码登陆处理
|
4月前
|
存储 监控 开发工具
Django 后端架构开发:手机与邮箱验证码接入、腾讯云短信SDK和网易邮箱
Django 后端架构开发:手机与邮箱验证码接入、腾讯云短信SDK和网易邮箱
78 0
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现(源码+lw+部署文档+讲解等)
|
5月前
|
存储 移动开发 Android开发
使用kotlin Jetpack Compose框架开发安卓app, webview中h5如何访问手机存储上传文件
在Kotlin和Jetpack Compose中,集成WebView以支持HTML5页面访问手机存储及上传音频文件涉及关键步骤:1) 添加`READ_EXTERNAL_STORAGE`和`WRITE_EXTERNAL_STORAGE`权限,考虑Android 11的分区存储;2) 配置WebView允许JavaScript和文件访问,启用`javaScriptEnabled`、`allowFileAccess`等设置;3) HTML5页面使用`<input type="file">`让用户选择文件,利用File API;
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的多功能智能手机阅读APP附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的多功能智能手机阅读APP附带文章源码部署视频讲解等
86 1
|
6月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现
基于SpringBoot+Vue+uniapp的多功能智能手机阅读APP的详细设计和实现
90 12
下一篇
DataWorks