项目需要长按复制文本内容,由于也没仔细研究过 mui 所以就直接百度。
看到了 花落乱了流年 这篇博客 我就把这个博客的代码融合到自己的项目里,实现了复制的需求

直接上代码

单独写到了一个 js 文件。首先把 长按事件 激活,因为默认是关闭的。我在里边添加了确认框,可以做到提醒用户的作用。在复制成功后边又有消息提醒。代码如下

// 激活长按按钮
mui.init({
gestureConfig: {
longtap: true, //默认为false
}
}); // 使用mui的长按事件 我把我的复制元素 class 设置为copy-text
mui('body').on('longtap', '.copy-text', function () {
// 每次触发事件就会使用 innerText 获取纯文本。
var copy_content = this.innerText;
// 加了一个确认框 让用户选择是否复制
mui.confirm('您要复制内容吗?', '小禾CRM', ['取消', '复制内容'], function (e) {
if (e.index == 1) {
//判断是安卓还是ios
if (mui.os.ios) {
// ios 的方法 这个我没具体研究过 直接拿来用了
var UIPasteboard = plus.ios.importClass("UIPasteboard");
var generalPasteboard = UIPasteboard.generalPasteboard();
//设置 复制的内容也就是 触发事件 innerText 获取的内容
generalPasteboard.plusCallMethod({
setValue: copy_content,
forPasteboardType: "public.utf8-plain-text"
});
generalPasteboard.plusCallMethod({
valueForPasteboardType: "public.utf8-plain-text"
});
// 在上边都走完 给用户一个提示
mui.toast('复制成功')
} else {
//安卓 的方法 这个我没具体研究过 直接拿来用了
var context = plus.android.importClass("android.content.Context");
var main = plus.android.runtimeMainActivity();
var clip = main.getSystemService(context.CLIPBOARD_SERVICE);
plus.android.invoke(clip, "setText", copy_content);
// 在上边都走完 给用户一个提示
mui.toast('复制成功')
}
}
})
})

也可以去掉长按或者改成点击把长按复制关闭即可

不需要确认框时也可以直接去掉,只保留if判断手机就行

mui 点击长按复制文本的更多相关文章

  1. ios label 简单的长按复制文本信息

    在iOS开发过程中,有时候会用到UILabel展示的内容,那么就设计到点击UILabel复制它上面展示的内容的功能,也就是Label长按复制功能.网上有很多种给Label添加长按复制功能的方法,这里我 ...

  2. ios html5 长按复制文本

    以前做的项目,主要是针对ios的,安卓上面也没有测试. 原理其实是系统自带的功能,那时候借鉴的其他网站,没有试验通过document.execCommand("Copy"),别的j ...

  3. Wx-小程序-长按复制文本

    view: <text bindlongtap='copy' data-name='{{name}}'>{{item.name}}</text> js: copy(e) { v ...

  4. 【咸鱼教程】Egret中可长按复制的文本(例如复制优惠码)

    一 实际效果二 实现原理三 源码下载 在egret中实现长按复制文本效果,一般用于复制优惠码什么的. 一 实际效果         二 实现原理 在egret的游戏元素都是绘制在canvas上的,我们 ...

  5. 原生 js 实现点击按钮复制文本

    最近遇到一个需求,需要点击按钮,复制 <p> 标签中的文本到剪切板 之前做过复制输入框的内容,原以为差不多,结果发现根本行不通 尝试了各种办法,最后使了个障眼法,实现了下面的效果 一.原理 ...

  6. js 实现点击复制文本内容

    js  实现点击复制文本内容 <table> <tr><td>姓名:<span onclick="copyContent(this);" ...

  7. Vue实现点击复制文本内容(原生JS实现)

    需求: 实现点击订单编号复制内容 实现步骤: 这里我是在element 的table组件里实现的步骤,仅供参考,实际上实现思路都大同小异 首先在需要点击的地方,添加点击事件 <div class ...

  8. js实现点击按钮复制文本功能

    最近项目活动中用到复制文本功能,发现在chrome中之前的clipboard的demo失效了,查了下发现是因为版本升级导致的.最新用法如下: <!DOCTYPE html> <htm ...

  9. 【转】TextView长按复制实现方法小结

    有这么一个需求,用户在浏览文本信息时希望长按信息就能弹出复制的选项方便保存或者在别的页面使用这些信息.类似的, 就像长按WebView或者EditText的内容就自动弹出复制选项. 这里面主要是2个特 ...

随机推荐

  1. tetetet

    http://www.wuwenhui.cn/2623.html http://www.360doc.com/content/16/1104/09/36005694_603810507.shtml

  2. Mysql中类似于Oracle中connect by ... start with的查询语句(木大看懂)

    表结构 create table sys_branch ( id ) not null, parent_id ), branch_name ), delete_flag ), primary key ...

  3. [基础]C++:名字的作用域

    每个名字都有自己的活动空间,同一个名字在不同的作用域可能指向不同的实体. 作用域:通常是以{}为分隔. 名字的有效区域开始于名字的声明,以声明语句所在的末端为结束. #include<iostr ...

  4. flink ETL数据处理

    Flink ETL 实现数据清洗   一:需求(针对算法产生的日志数据进行清洗拆分) 1. 算法产生的日志数据是嵌套json格式,需要拆分 2.针对算法中的国家字段进行大区转换 3.最后把不同类型的日 ...

  5. SAS学习笔记63 如何导出Log

    如上,将Log输出,然后又恢复到SAS系统里面的Log,把需要运行的程序放到他们中间就可以了.这种方法不会出现Log打印满了的情况 这种是先输出在SAS系统里面,然后在输出,在SAS里面Log的行是有 ...

  6. 方法1:使用Jenkins构建Docker镜像 --SpringCloud

    前提意义: SpringCloud微服务里包含多个文件夹,拉取仓库的所有代码,然后过根据选项参数使用maven编译打包指定目录的jar,然后再根据这个目录的Dockerfile文件制作Docker镜像 ...

  7. Linux实现MYSQl数据库的定时备份

    今天给大家分享一下如何在Linux下实现MYSQl数据库的定时备份. 前提需要保证你的Linux服务器已经安装了MYSQl数据库服务. 1.创建shell脚本 vim backupdb.sh 创建脚本 ...

  8. MySQL-5.7.26解压版安装教程

    1.下载地址:https://cdn.mysql.com//Downloads/MySQL-5.7/mysql-5.7.26-winx64.zip 2.在解压目录中添加 data文件夹 和 my.in ...

  9. 从ghost映像.gho文件快速创建vmware虚拟机

    从ghost映像.gho文件快速创建vmware虚拟机 https://www.cnblogs.com/blog2018/p/8857146.html ghost文件.gho和vmware文件都是磁盘 ...

  10. 并发编程之Disruptor并发框架

    一.什么是Disruptor Martin Fowler在自己网站上写了一篇LMAX架构的文章,在文章中他介绍了LMAX是一种新型零售金融交易平台,它能够以很低的延迟产生大量交易.这个系统是建立在JV ...