小程序中实现一键复制长段文本内容

做小程序开发,就知道其实小程序是有限制的,在小程序内无法打开网址,只允许从一个小程序跳到另一个小程序。

今天主要不是说小程序的限制,我们来看一下,如果网址不能打开的情况下,能否给用户提供“一键复制”功能?

必须可以,微信提供了复制的API,如下:

wx.setClipboardData({
  data: url,
  success: function (res) {
    util.showModelTips('复制成功');
  }
})

我们来看一下“一键复制”的使用场景~

一、复制全部内容(今天要说的重点)

实例一:复制网址

这个就是上面说的例子,就不详细介绍了

实例二:复制全部文本

这种情况也有,就是想复制一段内容出来。做法是监听长按事件bindlongtap,然后触发弹层,点击弹层,触发“复制代码”~

实例三:复制所有内容,用微信通用菜单形式展示

看了小程序的API,其实也提供了showActionSheet方法,可以把菜单做的更像微信原生菜单,效果图和代码如下:

wx.showActionSheet({
  itemList: ['复制内容', '上传背景图片'],
  success: function (res) {
    console.log(res.tapIndex)
  },
  fail: function (res) {
    console.log(res.errMsg)
  }
})

二、复制部分文本内容

小程序API也提供了选择复制,就是使用text标签,设置selectable="true",并且必须是text标签,如下:

<text class="c-desc" selectable="true">{{detail.desc}}</text>

OK,今天就分享到这儿~

原文发布于微信公众号 - 知晓程序员(bainaweb)

原文发表时间:2017-08-31

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏章鱼的慢慢技术路

使用Unity中的Box Collider组件完成游戏场景中的碰撞检测功能

1294
来自专栏程序员八阿哥

小白Pycharm使用(5):pycharm中使用anaconda

不同的操作系统都是直接的在官网中下载安装包进行下载,选择你最经常使用的Python版本进行安装,下载完之后,尽量的按照anaconda默认的行为安装,现在的版本...

671
来自专栏云计算教程系列

简单5步教你入门CVM Ubuntu系统

当您第一次创建新的Ubuntu服务器时,您应该尽早做一些配置,作为基本设置的一部分。这将提高服务器的安全性和可用性,并为后续操作奠定坚实的基础。

1463
来自专栏我的博客

谷歌浏览器扩展程序开发

先说为何要学这个,我们公司部署项目的时候有一个选择按钮,每次都得选中才能提交!于是就。。。 直接上代码! 配置文件:manifest.json { ...

2583
来自专栏web

vue.js环境搭建

1183
来自专栏小樱的经验随笔

Linux目录结构

Linux 目录结构 装完Linux,首先需要弄清Linux 标准目录结构 ? / root —?启动Linux时使用的一些核心文件。如操作系统内核、引导程序G...

2666
来自专栏地方网络工作室的专栏

Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(三)认识项目所有文件

Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(三)认识项目所有文件 在《Vue2+VueRouter2+Webpack...

1815
来自专栏https://www.cnblogs.com/L

Anaconda使用

Python易用,但用好却不易,其中比较头疼的就是包管理和Python不同版本的问题,特别是当你使用Windows的时候。为了解决这些问题,有不少发行版的Pyt...

763
来自专栏Albert陈凯

使用 Vagrant 打造跨平台开发环境

https://segmentfault.com/a/1190000000264347 Vagrant 是一款用来构建虚拟开发环境的工具,非常适合 php/py...

2705
来自专栏性能与架构

手机浏览器中的 DevTools

ruda 是手机浏览器中的开发者工具,是一个JS插件,在自己的页面中引入即可 Eruda 的由来 Eruda 的作者以前在手机中进行页面开发时,感觉日志输出非...

3385

扫描关注云+社区