如何檢測「複製圖像」瀏覽器事件？

使用jQuery，我可以檢測用戶何時複製的東西（如文本），用Ctrl-C或通過上下文菜單：如何檢測「複製圖像」瀏覽器事件？

$(document).on('copy',function(e){$('body').prepend('copy event <br>');});

然而，事件似乎並沒有當圖像被複制到觸發。我如何檢測圖像複製？具體而言，我想檢測<canvas>元素的複製，但任何<img>都應該作爲理解此問題的起點。

測試場景：在itself.You http://jsfiddle.net/jm23xe8w/

來源

2014-11-03 tmpearce

這可能會幫助你：http://www.quirksmode.org/dom/events/cutcopypaste.html – gurudeb 2014-11-03 15:25:40

你的目標是捕捉這個事件？ – 2014-11-03 19:42:26

@AlmaDo我需要用戶將圖像複製到他們的剪貼板，然後回到瀏覽器 - 這將允許使用來自跨網站圖像原始圖像的像素數據（沒有安全風險，因爲它是明確的用戶操作）。所以，當他們啓動一個複製事件時，我將啓用粘貼功能，使其直觀地顯示它的工作原理。 – tmpearce 2014-11-04 00:00:50

瀏覽器不支持複製圖像的事件，所以你需要通過一些tricks.also剪貼板來模擬它不保存圖像it.Clipboard只保存文本需要將圖像轉換爲base64編碼的字符串，然後將其保存到剪貼板並將其粘貼到您的應用程序上。但是存在這樣的問題：剪貼板數據，複製的圖像或其他某個應用程序的其他數據是否存在.For這樣，您可以首先在您的編碼字符串中添加一個唯一的字符串，並在結尾處添加並檢查它在何處粘貼。要將圖像轉換爲base64encode字符串，您可以使用以下代碼：

function getImageData(img) { 
    var canvas = document.createElement("canvas"); 
    canvas.width = img.width; 
    canvas.height = img.height; 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(img, 0, 0); 
    var imgd = canvas.toDataURL("image/png"); 
    return imgd; 
}

將img標記傳遞給此函數以獲取結果。

來源

2014-11-14 07:47:01 OnlyMAJ

如何檢測「複製圖像」瀏覽器事件？

回答

相關問題