項(xiàng)目需要長按復(fù)制文本內(nèi)容,由于也沒仔細(xì)研究過 mui 所以就直接百度。
看到了 花落亂了流年 這篇博客 我就把這個(gè)博客的代碼融合到自己的項(xiàng)目里,實(shí)現(xiàn)了復(fù)制的需求。
直接上代碼
單獨(dú)寫到了一個(gè) js 文件。首先把 長按事件 激活,因?yàn)槟J(rèn)是關(guān)閉的。我在里邊添加了確認(rèn)框,可以做到提醒用戶的作用。在復(fù)制成功后邊又有消息提醒。代碼如下
// 激活長按按鈕
mui.init({
gestureConfig: {
longtap: true, //默認(rèn)為false
}
});
// 使用mui的長按事件 我把我的復(fù)制元素 class 設(shè)置為copy-text
mui('body').on('longtap', '.copy-text', function () {
// 每次觸發(fā)事件就會使用 innerText 獲取純文本。
var copy_content = this.innerText;
// 加了一個(gè)確認(rèn)框 讓用戶選擇是否復(fù)制
mui.confirm('您要復(fù)制內(nèi)容嗎?', '小禾CRM', ['取消', '復(fù)制內(nèi)容'], function (e) {
if (e.index == 1) {
//判斷是安卓還是ios
if (mui.os.ios) {
// ios 的方法 這個(gè)我沒具體研究過 直接拿來用了
var UIPasteboard = plus.ios.importClass("UIPasteboard");
var generalPasteboard = UIPasteboard.generalPasteboard();
//設(shè)置 復(fù)制的內(nèi)容也就是 觸發(fā)事件 innerText 獲取的內(nèi)容
generalPasteboard.plusCallMethod({
setValue: copy_content,
forPasteboardType: "public.utf8-plain-text"
});
generalPasteboard.plusCallMethod({
valueForPasteboardType: "public.utf8-plain-text"
});
// 在上邊都走完 給用戶一個(gè)提示
mui.toast('復(fù)制成功')
} else {
//安卓 的方法 這個(gè)我沒具體研究過 直接拿來用了
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);
// 在上邊都走完 給用戶一個(gè)提示
mui.toast('復(fù)制成功')
}
}
})
})
我參考了QQ空間復(fù)制、網(wǎng)易云音樂評論復(fù)制。發(fā)現(xiàn)都是直接復(fù)制全部文本,并不是選擇的,所以這樣子完全符合現(xiàn)在主流需求。
使用起來也很簡單 在需要用到復(fù)制的頁面 引入上邊的js文件,在把需要復(fù)制的元素上添加class。