L'evento Incolla JavaScript funziona bene in Chrome ma non in Firefox

Question

Il mio obiettivo iniziale è ottenere un'immagine incollata dagli appunti. Ma ho problemi a ottenere l'evento paste.

In JSFiddle, dove ho riprodotto il problema, il codice HTML contiene solo un div:

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

La JavaScript lega prima la mia funzione handlePaste() per l'evento pasta.

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

Questa funzione dovrebbe essere chiamato quando l'utente preme CTRL + V oppure seleziona "incolla" nel menu del suo navigatore web.

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); 
    } 
} 

Importante: questa funzione accede a e.clipboardData per ottenere il contenuto degli Appunti. Ad esempio, se si preme il tasto PrtScrn, quindi Ctrl + V, si invia un'immagine di schermata di stampa al metodo handlePaste. L'ultimo avviso mostra "image/png" quando funziona correttamente.

Chrome v37: il JsFiddle funziona perfettamente. Firefox v32: il metodo handlePaste() non viene chiamato, il primo avviso non viene visualizzato.

Codice Il jsFiddle: http://jsfiddle.net/demeylau/ke44bufm/1/

Answer 1

Per quanto posso dire, si sta andando ad avere per gestire l'incollatura separatamente per agente browser. Joshua Gross copre un sacco di complessità della manifestazione pasta in questo articolo: Paste Wasteland

Firefox piace essere ancora più ottusi, ma è possibile leggere i dati di immagine come file trattando i dati degli Appunti come un Blob. (vedere il poscritto nell'articolo di Gross) Questo è praticamente un codice legacy non collegato in browser che gestiscono gli eventi del sistema operativo in modi leggermente diversi e riassume sinteticamente perché abbiamo le funzionalità più recenti standardizzate in cose come WebAPI. Spero che questo aiuti.