javascript - 获取剪贴板数据

Question

我正在尝试编写一个 Javascript 函数来在粘贴之前从剪贴板编辑内容。现在，我通过 JQuery 绑定了“粘贴”事件。

$(this.elementDoc).bind('paste', function(event){
   self.OnPaste(event);
});

但这并不重要。现在我想从剪贴板获取数据，但我不知道如何。我会很高兴每一个提示。

Answer 1

这是一个硬汉。如果我没记错的话，IE 允许访问剪贴板，但由于安全问题，默认情况下 Firefox 不允许访问。我必须为我正在处理的项目执行此操作，并且被迫使用一个小的 SWF 文件来进行复制。

http://www.jeffothy.com/weblog/clipboard-copy/

Answer 2

该clipboardData罐包含各种可能格式的数据。程序可能会以多种格式添加剪贴板数据。要查看格式，请查看clipboardData.types.

剪贴板数据通常包含纯文本，其中列出的第一个类型types是 MIME 类型“text/plain”。如果您从浏览器复制文本，您将在列表中看到两种类型：“text/plain”和“text/html”。根据您传入的字符串getData，您可以获取纯文本或 html。似乎“text”是“text/plain”的简写，而“url”是“text/uri-list”的简写。

element.addEventListener('paste', function(event) {
  var cb = event.clipboardData
  if(cb.types.indexOf("text/html") != -1) {        // contains html
    var pastedContent = cb.getData("text/html")
  } else if(cb.types.indexOf("text/html") != -1) { // contains text
    var pastedContent = cb.getData("text/html")
  } else {
    var pastedContent = cb.getData(cb.types[0])    // get whatever it has
  }

  // do something with pastedContent
})

有关如何使用的更多信息clipboardData.getData，请参阅丑陋的规范。

Answer 3

这是从 IE 或 Chrome 获取它的方法。首先，它防止实际粘贴发生，然后进行功能检查，然后将变量文本设置为剪贴板文本。有了它，您可以操作文本，然后将其设置为您粘贴到的输入/元素的值，或者您想要对其进行的任何其他操作。

//get clipboard text
event.preventDefault();
var text = null;
if (window.clipboardData) 
  text = window.clipboardData.getData("Text");
else if (event.originalEvent && event.originalEvent.clipboardData)
  text = event.originalEvent.clipboardData.getData("Text");

//manipulate the text
text = '..do stuff with it..';
//set the text
$(this).val(text);

Answer 4

$('#paste-button').click(function () {
    navigator.clipboard.readText()
        .then((text) => {
            $('#wallet-address').val(text);
        })
        .catch((err) => $('#wallet-address').val(''));
});