JavaScript - Clipboard API - Paste image handler

clipboard-paste-image.js

var IMAGE_MIME_REGEX = /^image\/(p?jpeg|gif|png)$/i;

var loadImage = function (file) {
    var reader = new FileReader();
    reader.onload = function(e){
        var img = document.createElement('img');
        img.src = e.target.result;
        
        var range = window.getSelection().getRangeAt(0);
        range.deleteContents();
        range.insertNode(img);
    };
    reader.readAsDataURL(file);
};

document.onpaste = function(e){
    var items = e.clipboardData.items;

    for (var i = 0; i < items.length; i++) {
        if (IMAGE_MIME_REGEX.test(items[i].type)) {
            loadImage(items[i].getAsFile());
            return;
        }
    }
    
   e.PreventDefault()
}

Great little gist. I turned this into a mini web-app to demonstrate pasting an image in a web page.
https://martindrapeau.github.io/image-clipboard/

Great little gist. I turned this into a mini web-app to demonstrate pasting an image in a web page.
https://martindrapeau.github.io/image-clipboard/

Oh, Github didn't give me any notice about your comment but late answer better than no answer at all, right? 🙂 Glad to help. Nice app you got there.