返回顶部
首页 > 资讯 > 移动开发 >uniapp H5页面、小程序页面获取手机号拨打电话
  • 487
分享到

uniapp H5页面、小程序页面获取手机号拨打电话

uni-app微信小程序小程序 2023-10-18 15:10:30 487人浏览 薄情痞子
摘要

效果图: 1、H5页面----手机号写死: h5平台下拨打 2、H5页面----动态获取手机号拨打: 拨打 data() {return {phone: ''}}, APP: {{phone

效果图:
在这里插入图片描述

1、H5页面----手机号写死:

<!-- #ifdef H5 -->  <a href="tel:10086">h5平台下拨打</a>  <!-- #endif -->

2、H5页面----动态获取手机号拨打:

<view><a :href="'tel:' + phone">拨打</a></view>
data() {return {phone: ''}},

APP:

<view @click="boda"><!-- #ifdef APP-PLUS --><text>{{phone}}</text><!-- #endif --><!-- #ifdef H5 --><a :href='phones'>{{phone}}</a><!-- #endif --></view>

小程序

<view class="make-phone" @click="makePhone">{{phone}}</view>

methods:

<script>export default {data() {return {phone: '',phones: '',}},    onShow() {        //H5this.phones = 'tel:' + 10086},   methods: {boda() {//或者 wx.makePhoneCall({uni.makePhoneCall({phoneNumber: this.phonesuccess: function() {console.log("拨打电话成功!")},fail: function() {console.log("拨打电话失败!")}});},makePhone() {wx.makePhoneCall({phoneNumber: this.phonesuccess: function() {console.log("拨打电话成功!")},fail: function() {console.log("拨打电话失败!")}});},}}</script>

来源地址:https://blog.csdn.net/maoge_666/article/details/130103453

--结束END--

本文标题: uniapp H5页面、小程序页面获取手机号拨打电话

本文链接: https://lsjlt.com/news/431433.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • uniapp H5页面、小程序页面获取手机号拨打电话
    效果图: 1、H5页面----手机号写死: h5平台下拨打 2、H5页面----动态获取手机号拨打: 拨打 data() {return {phone: ''}}, APP: {{phone...
    99+
    2023-10-18
    uni-app 微信小程序 小程序
  • 微信小程序的H5页面如何获取appid
    微信小程序的H5页面获取appid的操作方法:打开手机里的微信软件。点击需要查看的小程序。点击小程序右上角“…”,选择“关于”选项。再点击右上角“…”选项,打开“更多资料”选项即可查看小程序appid。...
    99+
    2024-04-02
  • uniapp中全局页面挂载组件(小程序,h5)
    1.uniapp 自带的 easycom 使用easycom的好处 1、简化组件的使用,提高开发效率 不论组件目录下安装了多少组件,easycom打包后会自动剔除没有使用的组件,对组件库的使用尤为友好。 说明 easycom方式引入...
    99+
    2023-08-30
    uni-app 小程序 vue.js
  • uniapp小程序使用web-view承载的html页面是uniapp H5时,H5与小程序通讯
    最近在小程序项目用到web-view,需要web-view承载的H5和小程序通讯,碰到个大坑,所以写一下实现过程及怎么避坑。 一、小程序向web-view承载的H5传递参数,直接在url后接参数即可(xxxxx.com) 二、H5向...
    99+
    2023-08-31
    uni-app 微信小程序 vue 前端 javascript
  • 如何获取小程序页面小程序码
    获取小程序页面小程序码的方法:用电脑登录微信公众平台,进入小程序管理后台。点击导航栏中的“工具”选项菜单,再选“生成小程序码”功能。填入小程序APPID进行搜索,然后点下一步。填入页面地址后,点确定生成小程序码,保存生成的小程序码图片即可。...
    99+
    2024-04-02
  • uniapp实现将页面转换成pdf(小程序、app、h5)
    使用html2Canvas和jspdf 安装这两个 npm i jspdf html2canvas uniapp在小程序无法获取dom,app端可在renderjs中获取 dom,小程序需要使用web-view导入一个h5页面,实现转pd...
    99+
    2023-10-11
    uni-app pdf 小程序
  • 小程序在哪个页面获取openid
    小程序获取openid的案例:第一步,获取code,在app.js文件添加以下代码://app.jsApp({  onLaunch: function() {   &nb...
    99+
    2024-04-02
  • 小程序如何获取页面高度
    小程序获取页面高度的代码示例:onReady: function () {//动态获取高度this.autoHeight();},//动态获取高度autoHeight:function(){var t...
    99+
    2024-04-02
  • 小程序如何获取页面元素
    在微信小程序中使用wx.createSelectorQuery()方法获取页面元素的样式,实现代码如下:wx.createSelectorQuery().select('元素id').boundingClientRect(function ...
    99+
    2024-04-02
  • 小程序如何获取页面上input值
    小程序获取页面上input值的两个方法;方法一:绑定input的value在对应的wxml文件中添加以下代码: <view><input type="text" bindi...
    99+
    2024-04-02
  • 小程序如何获取当前页面URL
    本篇内容介绍了“小程序如何获取当前页面URL”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!使用getCurrentPages可以获取当前加载...
    99+
    2023-06-26
  • 小程序如何获取当前页面的id
    小程序获取当前页面id的案例:.wxml文件代码:          <block wx:for-items="{...
    99+
    2024-04-02
  • 微信小程序页面如何获取数据
    微信小程序页面获取数据的案例:获取page数据,代码:var text=this.data.name ,这样就获取到初始化的值。page({data:{name:"test"},showData:function(){v...
    99+
    2024-04-02
  • 小程序如何获取页面滚动距离
    在小程序中使用onPageScroll()方法,通过e.scrollTop获取页面滚动距离。使用方法:onPageScroll: function(e) {console.log(e.scrollTop)}...
    99+
    2024-04-02
  • 【uniapp开发小程序】点击获取手机号(使用@getphonenumber)
    一、实现效果 二、代码实现: {{info.mobile}}点击获取手机号export default {data() {return {info: {}, //个人信息}},methods: {// 获取手机号getPhoneNumbe...
    99+
    2023-08-20
    uni-app 小程序 前端
  • 如何动态获取小程序页面的高度
    使用onReady事件动态获取小程序页面的高度实现代码如下:onReady: function () {//动态获取高度this.autoHeight();},//动态获取高度autoHeight:functi...
    99+
    2024-04-02
  • 小程序怎么在js中获取页面的值
    小程序在js中获取页面的值案例:在对应的wxml页面中添加以下代码:<form bindsubmit='formsubmit'><view class='Type'>...
    99+
    2024-04-02
  • 在哪里获取小程序页面访问路径
    获取小程序页面访问路径的方法最简单的方法就是找开发人员直接获取;进入小程序管理后台查询页面路径登录小程序管理后台,在数据分析中使用getCurrentPages命令获取页面路径如:var pages = getCurrentPages() ...
    99+
    2024-04-02
  • 小程序如何获取页面上多个input值
    小程序获取页面上多个input值的案例://wxml <input class="formInput" placeholder="请输入旧密码" pass...
    99+
    2024-04-02
  • 获取微信小程序页面路径的方法
    1. 打开你的微信公众号管理平台 2. 新建图文 3. 插入小程序 4. 根据appid搜索你要获取页面路径的小程序 appid可以点击右上角“...”,再在弹出框中点击小程序名称,在小程序更多资料里面可以找到 5. 点击获取更多页面路径,...
    99+
    2023-09-01
    微信小程序 小程序
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作