Javascript 粘贴图片并上传

使用截图工具截图时，可以把图片放到剪贴板中而不用保存图片，在要用到的地方直接粘贴，这个非常方便，那么怎么样使用 Javascript 来获取内存（剪贴板）中的图片呢？获取到以后，就可以上传了。

直接上代码

document.querySelector("#background-image").addEventListener("paste", function (e) {
    var target = e.target;
    var cbData;
    if (e.clipboardData) {
        cbData = e.clipboardData;
    } else if (window.clipboardData) {
        cbData = window.clipboardData;
    }
    if (cbData && cbData.items) {
        for (var i = 0; i < cbData.items.length; i++) {            
            if (cbData.items[i].type.indexOf('image') !== -1) {
                target.parentNode.className = target.parentNode.className + " processing";
                target.value = "图片上传中...";
                var file = cbData.items[i].getAsFile();
                var xhr = new XMLHttpRequest();
                xhr.open("POST", "/admin/media/Upload");
                xhr.onload = function (data) {
                    target.parentNode.className = target.parentNode.className.replace(" processing", "");
                    var result = JSON.parse(data.target.response);
                    if (result.id) {
                        target.value = result.url;
                        updateDisplay();
                    }
                }
                xhr.onerror = function () {
                    target.parentNode.className = target.parentNode.className.replace(" processing", "");
                    target.value = "图片上传失败";
                }
                var formData = new FormData();
                formData.append('file', file);
                formData.append("folder", "图片");
                xhr.send(formData);
                break;
            }
        }
    }

});

效果演示