JavaScript 读取电脑复制的内容

使用navigator.clipboard API读取

备注:由于安全和隐私原因,此API只能在安全上下文中运行(即HTTPS或本地服务器),并且在某些情况下可能需要用户交互(例如,点击事件)。

使用
javascript 复制代码
//HTML 
<el-button @click="ztbtn"><template #icon><el-icon><svg-icon
                      name="i-ep:refresh" /></el-icon></template>粘贴</el-button>



//JS
async function getClipboardText() {
  try {
    const text = await navigator.clipboard.readText();
    console.log('剪贴板内容:', text);
    // 假设您想要在用户成功读取剪贴板内容后显示一条消息
  } catch (err) {
    console.error("🚀 ~ readText ~ err:", err);
    // 可以在这里处理错误,比如显示一个错误消息
    // ElMessage.error("无法读取剪贴板内容");
  }
}
const ztbtn = ()=>{
  // 调用函数
getClipboardText();
}
相关推荐
雨季66623 分钟前
Flutter 三端应用实战:OpenHarmony “心流之泉”——在碎片洪流中,为你筑一眼专注的清泉
开发语言·前端·flutter·交互
换日线°27 分钟前
前端3D炫酷展开效果
前端·3d
广州华水科技34 分钟前
大坝变形监测的单北斗GNSS技术应用与发展分析
前端
Dontla38 分钟前
浏览器localStorage共享机制介绍(持久化客户端存储方案)本地存储冲突、iframe、XSS漏洞、命名空间隔离
前端·网络·xss
●VON41 分钟前
React Native for OpenHarmony:构建高性能、高体验的 TextInput 输入表单
javascript·学习·react native·react.js·von
●VON1 小时前
React Native for OpenHarmony:ActivityIndicator 动画实现详解
javascript·学习·react native·react.js·性能优化·openharmony
霍理迪1 小时前
JS其他常用内置对象
开发语言·前端·javascript
tao3556671 小时前
HTML-03-HTML 语义化标签
前端·html
小马_xiaoen1 小时前
IndexedDB 从入门到实战:前端本地大容量存储解决方案。
前端
jiayong231 小时前
Vue2 与 Vue3 常见面试题精选 - 综合宝典
前端·vue.js·面试