如何从Firefox中的剪贴板获取数据

我想触发元素上的onpaste事件来检索剪贴板中的数据（我想检查图像是否存在于剪贴板中并将其上载到服务器中）。它适用于Chrome浏览器：如何从Firefox中的剪贴板获取数据

$('#textarea')[0].onpaste = function(event) 
{ 
    var items = event.clipboardData.items; 

    if (items.length) 
    { 
     var blob = items[0].getAsFile(); 
     var fr = new FileReader(); 

     fr.onload = function(e) 
     { 
      alert('got it!'); 
     } 

     fr.readAsDataURL(blob); 
    } 
}

不适用于Firefox：event.clipboardData.items不存在。你有什么想法如何检测元素中的粘贴事件？

来源

2012-02-10 Bald

由于安全原因，Firefox不允许您访问剪贴板。无论如何，你的问题是重复http://stackoverflow.com/questions/127040/copy-put-text-on-the-clipboard-with-firefox-safari-and-chrome – 2012-02-10 21:36:45

看来不是。抱歉。

http://support.mozilla.org/en-US/kb/Granting%20JavaScript%20access%20to%20the%20clipboard

JavaScript get clipboard data on paste event (Cross browser)

来源

2012-02-10 21:34:09

在leas第一个链接是不是真正相关;这是关于完全无条件访问剪贴板的。 – ThiefMaster 2012-02-10 21:36:49

相信我能。在这个例子中，我使用后检索图像从剪贴板Ctrl + V：

<div id="foo" style="width: 200px; height: 200px" contenteditable="true">Paste here!</div> 
$('#foo')[0].onpaste = function(e) 
{     
    setTimeout(function() 
    { 
     var blob = $('#foo img').attr('src'); 


     $.post('/upload/image', {'data': blob}, function(result) 
     { 


     }, 'json'); 

    }, 200); 
}

它的工作原理与具有contenteditable属性<div>元素，但不与<textarea>

P.S.工作很抱歉回答我自己的问题，但这段代码可能有助于某人。

来源

2012-02-11 07:59:14 Bald

嘿，我需要你的帮助。您的解决方案是正确的，但我有一个疑问，如果contenteditable div已经包含2个图像，当我Crtl + V然后它上传共3张图片在服务器上？ – 2015-07-07 06:31:34

呃......上面的代码上传了'src'属性中的所有内容。 – Bald 2015-07-07 10:35:16

我知道它上传了src属性值，但是我想知道是否有3个src已经在div中可用，那么它总共上传了4个src（其中3个已经存在，第四个新粘贴）？ – 2015-07-07 10:54:13

你需要创建一个CONTENTEDITABLE格将举行上粘贴图像

var pasteCatcher = $('<div/>',{'id':'container'}); 
$('body').append(pasteCatcher); 
var pasteCatcher = document.getElementById('container'); 
       pasteCatcher.setAttribute("contenteditable", "");

，那么你需要等待粘贴事件并对其进行处理

window.addEventListener("paste",processEvent); 
function processEvent(e) { 
//some functionality 
}

而且写代码抢来自contenteditable div的图像数据并将其发送到服务器。

来源

2013-03-07 10:44:25 Mahendra

如何从Firefox中的剪贴板获取数据

回答

相关问题