展示功能小程序(后期更新后台接口调用)

news/2024/7/20 4:31:38 标签: 小程序

下拉列表:

展开前

展开后

 

//.wxml文件

<view class="page">

<view class="page_bd">

<view class="body_head" bindtap="showitem">展开全部信息</view>

<navigator url="">

<view class="{{open?'display_show':'display_none'}}" bindtap="calling" ><image class='call' src='../image/call.png' ></image> 电话:

</view>

</navigator>

<navigator url="" >

<view bindtap='copyText' data-text="{{contents}}" class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/weixin.png' ></image> 微信:11</view>

</navigator>

<navigator url="">

<view class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/gonsi.png' ></image> 公司:广

</navigator>

<navigator url="">

<view bindtap='copyText' data-text="{{ff}}" class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/dizhi.png' ></image> 地址:广东省广州市

</view>

</navigator>

</view>

</view>

//.wxss

 

.page_bd{

padding: 10px;

background-color: snow;

}

 

.body_head{

border: 1px solid;

border-color: beige;

padding: 10px;

display: flex;

justify-content: center;

font-size: 10px;

}

.display_show{

display: block;

border: 1px solid;

border-color: beige;

padding: 10px;

font-size: 15px;

}

.display_none{

display: none;

}

 

.img-plus-style {

height: 70rpx;

width: 70rpx;

position: fixed;

bottom: 220rpx;

right: 30rpx;

opacity: 0.7

}

.img-plus-style1 {

height: 50rpx;

width: 50rpx;

position: fixed;

bottom: 130rpx;

right: 30rpx;

opacity: 0.7

}

.zindex100{z-index: 100}

.yc{opacity: 0}

 

复制功能:

//.js

Page({

data: {

// text:"这是一个页面"

open: false,

contents: '18588712461',

ff: '广东省',

},

copyText: function (e) {

console.log(e)

wx.setClipboardData({

data: e.currentTarget.dataset.text,

success: function (res) {

wx.getClipboardData({

success: function (res) {

wx.showToast({

title: '复制成功'

})

}

})

}

})

},

 

///

地图标注:

//.wxml

<view class="page-section page-section-gap">

<map

id="myMap"

style="width: 100%; height: 300px;"

latitude="555"

longitude="45"

markers="{{markers}}"

covers="{{covers}}"

show-location

></map>

</view>

</view>

 

//.js

data: {

markers: [{

id: 1,

latitude: 554,

longitude: 44,

name: '恒503'

}],

 

需要源码请QQ联系:1174787689

 

 

 

 


http://www.niftyadmin.cn/n/515722.html

相关文章

uoj #148. 【NOIP2015】跳石头 二分

题目链接 给n个石头&#xff0c; 可以移除其中的m个&#xff0c; 求移除之后它们之间距离的最大值。 看到最大值很容易想到二分&#xff0c; 我们二分距离x&#xff0c; 判断两个石头之间的距离是否小于x&#xff0c; 如果小于&#xff0c; 那么就移除当前的石头。 #include &l…

html指定图片失效时间,设置cookie指定时间失效(实例代码)

实例如下&#xff1a;// 设置cookie在当天指定时间点过期并提示function setCookie(name,value,Deadline){// 获取当前日期对象var curDate new Date();// 获取当前日期对应的时间戳var curTime curDate.getTime();// 获取指定时间的时间戳var endTime convertTime(curDate,…

EF中Model实体类生成表中的疑问?

问题一&#xff1a;全部实体类继承了一个Bassice类&#xff0c;最后生成的表只有Bassices表&#xff1f; 问题二&#xff1a;注释了Bassice类&#xff0c;但是生成的Boss类多了es&#xff0c;还有其他的都有s后缀 希望大神指点一下。

2 软件测试基础

文章目录 1. 软件测试的生命周期2. 测试在软件生命周期里做了什么&#xff1f;3.如何描述一个bug4.如何定义bug的级别5. bug的生命周期6.测试人员与开发人员发生冲突如何处理&#xff1f; 1. 软件测试的生命周期 2. 测试在软件生命周期里做了什么&#xff1f; 3.如何描述一个bu…

浏览器是用于展示html文档的,【判断题】浏览器的作用是读取 HTML 文档,并以网页的形式显示出它.._简答题试题答案...

【说明】当用户启动html浏览器并首次打开下面的html文档时&#xff0c;Java Applet小程序在显示面板上显示字符串“欢迎您!”&#xff1b;当html页面被其他窗口遮挡后再次显示时&#xff0c;小程序在显示面板上显示“欢迎您回来!”[Java代码]import java&#xff0e;awt&#x…

用UIInterpolatingMotionEffect产生透视效果

用UIInterpolatingMotionEffect产生透视效果 效果 源码 https://github.com/YouXianMing/Animations // // MotionEffectViewController.m // Animations // // Created by YouXianMing on 16/2/18. // Copyright © 2016年 YouXianMing. All rights reserved. //#impo…

工作日志2014-08-25

星期一 来了新iOS同事&#xff0c;赵龙&#xff0c;还有Android的两位&#xff0c;都没说什么话&#xff5e; 工作时间: 1.加入headView。 2.切割线不能像多媒体作业那样顶格&#xff1b; 转载于:https://www.cnblogs.com/mengfanrong/p/5205234.html

计算机应用基础05测试在线,《计算机应用基础》第05章在线测试

《计算机应用基础》第05章在线测试0ibczbrah2014.04.30浏览60次分享举报1、PowerPoint放映文件的扩展名是&#xff3f;&#xff3f;&#xff3f;&#xff3f;。A、psdB、pptC、ptsD、pps2、在PowerPoint中&#xff0c;对幻灯片重新排列&#xff0c;添加和删除幻灯片以及演示文稿…