当前位置:网站首页>JS -- realize click Copy function
JS -- realize click Copy function
2022-04-23 14:55:00 【CaseyWei】
Select the copy
<template>
<el-button type="primary" plain @click="onCopy"> Copy </el-button>
</template>
<script>
export default {
methods:{
onCopy(){
document.execCommand("Copy"); // Execute browser copy command
this.$message({
message: ' Replication success ',
type: 'success'
});
}
}
}
</script>
Click replication
<template>
<el-button type="primary" plain @click="onCopy"> Copy </el-button>
</template>
<script>
export default {
methods:{
onCopy(){
const url = ' I am the content to be copied '
let oInput = document.createElement('input')
oInput.value = url
document.body.appendChild(oInput)
oInput.select() // Select object ;
document.execCommand('Copy') // Execute browser copy command
this.$message({
message: ' Replication success ',
type: 'success'
})
oInput.remove()
}
}
</script>
版权声明
本文为[CaseyWei]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/04/202204231454092339.html
边栏推荐
- I/O复用的高级应用之一:非阻塞 connect———使用 select 实现(也可以用 poll 实现)
- A good tool: aardio
- Leetcode162 - find peak - dichotomy - array
- PCIe X1 插槽的主要用途是什么?
- When splicing HQL, the new field does not appear in the construction method
- 1 - first knowledge of go language
- Chapter 7 of JVM series -- bytecode execution engine
- 脏读、不可重复读和幻读介绍
- Leetcode165 compare version number double pointer string
- 详解TCP的三次握手
猜你喜欢
[jz46 translate numbers into strings]
we引用My97DatePicker 实现时间插件使用
ASEMI整流模块MDQ100-16在智能开关电源中的作用
LeetCode167-两数之和II-双指针-二分-数组-查找
分享 20 个不容错过的 ES6 的技巧
The art of automation
详解TCP的三次握手
[detailed explanation of factory mode] factory method mode
Detailed comparison between asemi three-phase rectifier bridge and single-phase rectifier bridge
What is the effect of Zhongfu Jinshi wealth class 29800? Walk with professional investors to make investment easier
随机推荐
I/O复用的高级应用之一:非阻塞 connect———使用 select 实现(也可以用 poll 实现)
thinkphp5+数据大屏展示效果
面试官:说一下类加载的过程以及类加载的机制(双亲委派机制)
三、梯度下降求解最小θ
eolink 如何助力遠程辦公
Brute force of DVWA low -- > High
分享3个使用工具,在家剪辑5个作品挣了400多
[servlet] detailed explanation of servlet (use + principle)
Alexnet model
nuxt项目:全局获取process.env信息
你还不知道责任链模式的使用场景吗?
qt之.pro文件详解
SVN详细使用教程
pnpm安装使用
Explain TCP's three handshakes in detail
Go basic reflection
GIS数据处理-cesium中模型位置设置
Leetcode151 - invert words in string - String - simulation
Introduction to dirty reading, unrepeatable reading and phantom reading
OC 转 Swift 条件编译、标记、宏、 Log、 版本检测、过期提示