JavaScript粘贴事件在Chrome浏览器中正常工作，但不是Firefox

Question

我最初的目标是从剪贴板上粘贴图像。但是我遇到了粘贴事件的麻烦。

在的jsfiddle，我在那里再现了问题，HTML只包含一个div：

<div style="width: 200px; height: 200px; background: grey" id="pasteTarget" > </div> 

中的JavaScript首先结合我的功能handlePaste（）的糊状事件。

window.onload = function() { 
    //adding paste event listener on the div 
    document.getElementById("pasteTarget"). 
     addEventListener("paste", handlePaste); 
}; 

当用户按下Ctrl + V或在浏览器的菜单中选择“粘贴”时，应该调用此函数。

function handlePaste(e) { 
    alert("I'm in handlePaste");  
    for (var i = 0 ; i < e.clipboardData.items.length ; i++) { 
     var item = e.clipboardData.items[i]; 
     console.log("Item: " + item.type); 
     alert(item.type); 
    } 
} 

重要提示：该函数访问e.clipboardData以获取剪贴板的内容。例如，如果按下PrtScrn键，然后按Ctrl + V，则将打印屏幕图像发送到handlePaste方法。 当它工作正常时，最后的警报显示“image/png”。

Chrome v37：JsFiddle工作正常。 Firefox v32：不调用handlePaste（）方法，第一个警报不会弹出。

的代码的jsfiddle：http://jsfiddle.net/demeylau/ke44bufm/1/

Answer 1

据我所知，你将不得不为每个浏览器代理单独处理的粘贴。 约书亚格罗斯涵盖了很多这篇文章中的paste事件的错综复杂的：Paste Wasteland

火狐喜欢更加钝，但它可以通过处理剪贴板数据作为BLOB读取图像数据作为文件。 （请参阅Gross的文章中的后记） 这是在浏览器中以几乎不同的方式处理操作系统事件的非遗漏代码，简洁地总结了为什么我们在WebAPI等事物中标准化了大多数新功能。 我希望这可以帮助。