【问题标题】:Copy Paste In JavaScript在 JavaScript 中复制粘贴
【发布时间】:2014-12-04 05:26:01
【问题描述】:

这是一个古老的问题,但我仍然遇到问题。你看,我正试图将一些 Excel 数据粘贴到文本区域中,但是愚蠢的浏览器在这样做时会冻结很长一段时间,因为上帝知道他们做了什么“智能”解析。我无法摆脱这一点(文件上传是不可能的,我的老板希望我将 Excel 中的行粘贴到文本区域中)。

好消息是在标准文本框中粘贴是可行的。但我不能强迫他们粘贴在那里。所以我试图捕捉文本区域中的粘贴事件,然后将文本扔到文本框中。不幸的是,我在粘贴部分停了下来。我无法通过 JS 将文本粘贴到简单的文本框中。

所以我的问题是:如何粘贴文本,如何通过 JS 调用它?有一些解决方案只能在 IE 中使用,那不好,当然 ::- )。

【问题讨论】:

  • 常规文本框更快,因为它只包含一行(duh)。
  • 当然。但它仍然可以粘贴 Excel 数据,以制表符分隔。

标签: javascript clipboard copy-paste


【解决方案1】:

简单。

var isIe = (navigator.userAgent.toLowerCase().indexOf("msie") != -1 
            || navigator.userAgent.toLowerCase().indexOf("trident") != -1);

document.getElementById('textinput').addEventListener('paste', function(e) {
    var text;
    
    if (isIe) {
        text = window.clipboardData.getData('Text')   
    } else {
        text = e.clipboardData.getData('text/plain');
    }
    
    // Do whatever you want with the text
    console.log(text);
    
    //If you don't want the text pasted in the textarea
    e.preventDefault();
});
<textarea id="textinput"></textarea>

如果您愿意,您甚至可以摆脱 textarea 并更直接地执行此操作。我写了一个技术 blog post 解释我们如何在 Lucidchart(我工作的地方)进行复制和粘贴。

【讨论】:

    【解决方案2】:

    抱歉,没有完全理解这个想法。你不能附加到 xtarea 的onpaste 事件(至少我知道 IE 有这样的事件)然后简单地将 textarea 的值设置为粘贴的值吗?

        pastedContent = window.clipboardData.getData("Text");
        document.getElementById("yourtextarea").value = pastedContent;
    

    编辑:好的,这似乎只适用于 IE 和 newer versions of FF,但它不是跨浏览器的解决方案。

    【讨论】:

    • 这是一个仅限 IE 的解决方案 ::- (
    【解决方案3】:

    我无法通过 JS 将文本粘贴到简单的文本框中

    当您说“简单文本框”时,您的意思是 <input type="text">?如果是这样,那么我认为将其 value 属性设置为您从 <textarea> 捕获的文本应该可以工作。

    【讨论】:

    • 据我了解,问题在于以跨浏览器的方式捕获“粘贴”事件
    • 我可以捕捉到粘贴事件,但不能捕捉到粘贴的数据。有一些类似 ExecCommand 的命令,但它们只适用于 IE。
    • 啊。怎么样: 1. 让粘贴事件在<textarea> 中完成。 2、读取textarea的value属性,获取粘贴的文本。 3. 将<textarea>value 设置为空字符串。 4.将普通文本字段的value设置为第2步得到的文本。
    【解决方案4】:

    在 Firefox 或 Mozilla 中启用 javascript 复制到剪贴板:http://www.febooti.com/support/website-help/website-javascript-copy-clipboard.html

    【讨论】:

    • 这不是解决方案,因为您无法远程控制用户的 FF 设置。
    【解决方案5】:

    尝试CodeMirror 作为替代解决方案。不会通过复制和粘贴大量/excel 数据来检查它,但也许这有帮助...

    【讨论】: