点击按钮:复制div中的文本内容到剪切板

效果展示

html代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Document</title>
  </head>
  <body>
    <textarea id="textArea">这是文字内容</textarea>
    <button onclick="copyToClipBoard()">Copy</button>

    <script src="link to your JS file"></script>
  </body>
</html>

JS代码

function copyToClipBoard() {
  var content = document.getElementById('textArea');

  content.select();
  document.execCommand('copy');

  alert('Copied!');
}

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在 Element Plus 复制数组内容到剪贴板,你可以使用以下步骤: 1. 确保已经安装并正确引入 Element Plus 组件库。 2. 创建一个按钮或其他触发元素,并在点击事件的处理函数执行复制操作。 3. 使用 JavaScript 的 Clipboard API 来实现复制功能。以下是一个示例代码: ```html <template> <div> <el-button @click="copyArrayData">复制数组内容</el-button> </div> </template> <script> export default { data() { return { arrayData: [1, 2, 3, 4, 5] // 要复制的数组内容 }; }, methods: { copyArrayData() { const arrayText = this.arrayData.join(', '); const textarea = document.createElement('textarea'); textarea.value = arrayText; document.body.appendChild(textarea); textarea.select(); document.execCommand('copy'); document.body.removeChild(textarea); this.$message.success('数组内容复制'); } } }; </script> ``` 在上面的代码,`copyArrayData` 方法会将数组的内容复制到剪贴板。首先,通过 `join` 方法将数组转换为字符串,并用逗号分隔每个元素。然后,创建一个 `<textarea>` 元素,将字符串内容赋值给它,并将其添加到页面。接下来,通过 `select` 方法选文本内容,并使用 `execCommand('copy')` 将其复制到剪贴板。最后,移除 `<textarea>` 元素并显示一个成功的消息。 请注意,这只是一个简单的示例,具体实现可能需要根据你的项目和需求进行调整。 希望这个示例对你有帮助!如果你还有任何其他问题,请随时提问。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值