微信小程序 --长按复制、点击复制实现

半杯水 · 甜

已于 2024-05-21 21:54:55 修改

阅读量6.4k

点赞数 1

文章标签：微信小程序小程序前端

于 2022-09-24 10:24:44 首次发布

本文链接：https://blog.youkuaiyun.com/qq_62328748/article/details/127021977

版权

该博客内容涉及微信小程序的开发，具体讲述如何在WXML和JS中实现长按复制文本的功能。通过使用`<text selectable>`标签和`wx.setClipboardData`API，用户可以方便地复制页面上的特定文本，例如地址ID。同时，提供了点击复制的示例，利用`bindtap`事件和`dataset`传递数据完成复制操作，并显示提示信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

长按复制

<text selectable="true" user-select='true'>长按复制：{{address_id}}</text>

点击复制

wxml

<view bindtap="copying" data-txt='{{item.txt}}'>点击复制：{{item.txt}}</view>

  copying (e) {
    var txt= e.currentTarget.dataset.txt;
    wx.setClipboardData({
    data: txt,
    success: function (res) {
         
    wx.showToast({
     title: '已复制',
     icon: 'none', //没有图标
     duration: 2000 //持续的时间
       })

    }
});

},