如何使用 javascript 将变量的内容放入剪贴板？

Question

function Copy() // this function will be latched to a button later on.
{
    var text = writePreview(); // this pours in the formatted string by the writePreview() function to the variable 'text'
    text = br2nl(text); //variable 'text' is purified from <br/> and is replaced by a carriage return

    //I need some code here to pour in the contents of the variable 'text' to the clipboard. That way the user could paste the processed data to a 3rd party application
}

我正在构建离线客户端 Web 应用程序。这样做的主要目的是让用户输入字段，格式化文本使其符合特定条件，然后单击复制以便他们可以将其粘贴到第 3 方 CRM。

唯一可用的浏览器是 Google Chrome。我搜索了互联网，希望找到一个简单的解决方案。

我不担心安全问题，因为此应用程序不会发布，仅供离线使用。

我想让它尽可能简单，添加不可见的文本区域会破坏布局。我当前的环境不允许使用 Flash。

Answer 1

看看clipboard.js

A modern approach to copy text to clipboard

No Flash. No dependencies. Just 2kb gzipped

https://clipboardjs.com/

Answer 2

这已通过更新我的浏览器 (Google Chrome v49) 解决。我使用的是较低版本 (v34)。

发现GoogleChrome以后的版本(v42+)支持document.execCommand('copy')

希望对大家有所帮助

以下是我使用的函数：

function SelectAll(id)
{
    document.getElementById(id).focus();
    document.getElementById(id).select();
}

function copy()
{
    SelectAll('textAreaID');
    document.execCommand("Copy", false, null);
}

Answer 3

根据 this article“在 javascript 中，将值从变量复制到剪贴板并不简单，因为没有直接命令。”。

因此，按照那里的建议，我做了以下事情：

在 html 文件中定义了以下内容 - 我在底部添加了（我从未注意到添加和删除元素）：

<div id="container"/>
然后在 Javascript 我补充说：

.

function copyQ() {

        var container = document.getElementById("container");
        var inp = document.createElement("input");
        inp.type = "text";
        container.appendChild(inp); 
        inp.value = "TEST_XYZ";
        inp.select();
        document.execCommand("Copy");
        container.removeChild(container.lastChild);
        alert("Copied the text: " + inp.value);
    }

可能有更好的方法，但它对我有用。

更新：

此外，我发现如果您的文本是多行的，并且如果您使用文本类型的输入，所有文本都会转换为单行文本。

为了保留段落/单独的行，我尝试使用 textarea 并按原样复制文本 - 多行：

    var inp = document.createElement("textarea");
    //inp.type = "text";

希望对大家有所帮助。

如何使用 javascript 将变量的内容放入剪贴板？

How do I put the contents of a variable to the clipboard using javascript?

html

javascript

client-side