js实现文本复制到剪切板

这篇具有很好参考价值的文章主要介绍了js实现文本复制到剪切板。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

复制文本到剪切板可使用navigator.clipboard.writeText()方法,如需兼容ie等老版本浏览器可使用execCommand()方法。文章来源地址https://www.toymoban.com/news/detail-643851.html

function textCopy(t) {
    // 如果当前浏览器版本不兼容navigator.clipboard
    if (!navigator.clipboard) {
        var ele = document.createElement("input");
        ele.value = t;
        document.body.appendChild(ele);
        ele.select();
        document.execCommand("copy");
        document.body.removeChild(ele);
        if (document.execCommand("copy")) {
            console.log("复制成功!");
        } else {
            console.log("复制失败!");
        }
    } else {
        navigator.clipboard.writeText(t).then(function () {
            console.log("复制成功!");
        }).catch(function () {
            console.log("复制失败!");
        })
    }
}

到了这里,关于js实现文本复制到剪切板的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【Vue 插件篇】粘贴板插件 clipboard.js 与 原生JS中的复制、剪切、粘贴

    在前端项目开发过程中,文本的复制粘贴功能经常会被用到。如上图,将列表中的链接地址进行复制,到浏览器中粘贴打开。再或者一些网站上,通过按钮粘贴输入框中的代码的功能等等。今天,我们就来讲一下,Vue 项目中用于复制的一个插件 clipboard。 clipboard官网 数字化管

    2024年01月19日
    浏览(66)
  • (简单成功)原生js实现点击复制文本

    目录 背景 核心代码 案例 我们开发中可能会有点击复制的功能,那么下面将讲述 select() 方法用于选择该元素中的文本。 document.execCommand(\\\'copy\\\') 执行浏览器复制命令

    2024年02月12日
    浏览(35)
  • 如何使用JS拦截并禁止用户复制、剪切、粘贴、鼠标右键(含破解方法)

    想必大家经常会遇到这样的需求,禁止用户复制、剪切、另存为、鼠标右键的操作等。今天一篇文章学会拦截并禁止用户特定操作及破解方法。正所谓道高一尺魔高一丈啊能禁止也能破解 在相关dom标签上给元素onselectstart 赋值为return false 或者在script中写类似下面这种代码:

    2024年02月12日
    浏览(32)
  • JavaScript实现点击复制(JS访问剪贴板相关)

    一、具体代码 ​ 网页前端开发中有时会出现这样的场景:让用户点击某个按钮,然后就能直接复制对应的文本内容,让用户可以将文本内容粘贴到想要粘贴的地方,常用于分享功能模块中。如果想要实现这种效果就需要我们去访问用户的剪贴板,然后把想要复制的内容写入

    2024年02月11日
    浏览(33)
  • 实现点击复制到剪切板功能

    该功能使用VueUse实现 什么是 VueUse VueUse不是Vue.use,它是为Vue 2和3服务的一套Vue Composition API的常用工具集,是目前世界上Star最高的同类型库之一。它的初衷就是将一切原本并不支持响应式的JS API变得支持响应式,省去程序员自己写相关代码。 VueUse 是一个基于 Composition API 的实

    2024年02月15日
    浏览(30)
  • vue中js实现点击复制文本到剪贴板-三种方案

    因为在网上找了一些很杂乱 不适用 所以自己写一篇记录分享一下 vue中js实现点击复制文本到剪贴板-三种方案 效果: 首先,我们需要安装clipboard库,它是一个轻量级的JavaScript库,用于复制/粘贴文本到剪贴板。 命令行运行npm install clipboard --save进行安装。 使用该库实现代码如

    2024年02月14日
    浏览(27)
  • vue2 使用pdf.js 实现pdf预览,并可复制文本

            需求:pdf预览,并且可以选中pdf的内容进行复制。                 在ruoyi的vue前端项目中用到,参考了网上不少文章,因为大部分没给具体的pdf.js版本,导致运行过程中报各种api 错误,经过尝试以下版本可用,故记录一下:         安装依赖:         vue 页面

    2024年01月19日
    浏览(45)
  • 【Unity复制功能】Unity复制到剪切板三端实现方法

    一、安卓和IOS方案 直接使用Unity提供的GUIUtility.systemCopyBuffer方案 链接: https://docs.unity.cn/cn/2021.3/ScriptReference/GUIUtility.html 例如: 二、小程序(WebGL) 1、web这边需要定义复制接口:WebSetCopy 2、Unity这边 首先定义方法调用web接口 然后在胶水函数中声明

    2024年04月16日
    浏览(20)
  • 【uniapp开发小程序】实现读取手机剪切板,实现长按内容复制

    效果图: 完整代码:   第一种方式:点击按钮复制到剪切板 ps:多次点击也只会复制一次  第二种方式:长按内容复制到剪切板 效果展示 所需js:  引用 jquery.js  和  clipboard.min.js jQuery就不用多说了,而 clipboard.min.js 是一个 JavaScript 库,用于实现网页上的复制到剪贴板功能

    2024年02月07日
    浏览(32)
  • RSAUtil 前端 JavaScript JSEncrypt 实现 RSA (长文本)加密解密

    文章归档:https://www.yuque.com/u27599042/coding_star/cl4dl599pdmtllw1 import JSEncrypt from ‘jsencrypt’ import {stringIsNull} from “@/utils/string_utils.js”:https://www.yuque.com/u27599042/coding_star/slncupw7un3ce7cb import {isNumber} from “@/utils/number_utils.js”:https://www.yuque.com/u27599042/coding_star/tuwmm3ghf5lgo4bw 注意: 此方

    2024年04月22日
    浏览(51)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包