使用jquery fileupload从剪贴板上传图像

时间:2015-08-24 10:46:16

标签: jquery file-upload

我想使用 ctrl + c alt + PrtScr 命令上传图像,然后粘贴到容器或多个容器中以便在服务器上上传。我正在使用现有的JQuery函数(包括在下面),但我无法对其进行编码。请告诉我。

$(function(){  
var btnUpload=$('#upload');  
var status=$('#status');  
new AjaxUpload(btnUpload, {  
    action: 'upload-file.php',  
    //Name of the file input box  
    name: 'uploadfile',  
    onSubmit: function(file, ext){  
        if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){   
              // check for valid file extension   
            status.text('Only JPG, PNG or GIF files are allowed');  
            return false;  
        }  
        status.text('Uploading...');  
    },  
    onComplete: function(file, response){  
        //On completion clear the status  
        status.text('');  
        //Add uploaded file to list  
        if(response==="success"){  
            $('<li></li>').appendTo('#files').html('<img src="./uploads/'+file+'" alt="" /><br />'+file).addClass('success');  
        } else{  
            $('<li></li>').appendTo('#files').text(file).addClass('error');  
        }  
    }  
});});

我将非常感谢您提供的任何帮助。

1 个答案:

答案 0 :(得分:1)

好吧,如果你想使用剪贴板中的数据,你应该检查http://www.w3.org/TR/clipboard-apis/

基本上,一旦你获得了数据,你需要一个文件界面来上传它。

例如:

file = item.getAsFile() -> Returns a File object

因此,您需要以类似的方式处理粘贴的数据以获取文件界面。

来自:https://mobiarch.wordpress.com/2013/09/25/upload-image-by-copy-and-paste/

function handlePaste(e) {
for (var i = 0 ; i < e.clipboardData.items.length ; i++) {
    var item = e.clipboardData.items[i];
    console.log("Item type: " + item.type);
    if (item.type.indexOf("image") != -1) {
        uploadFile(item.getAsFile());
    } else {
        console.log("Discarding non-image paste data");
    }
}