Jquery文件上传预览拇指

Question

在http://blueimp.github.com/jQuery-File-Upload/的示例中，文件上传器会以缩略图的形式创建您要上传的图片的预览。

我知道如何在上传后显示缩略图，因为done:回调会返回有关您上传的文件的一些数据，但是如何在上传之前完成而不先实际上传文件（我不认为这有可能没有先上传）？

Answer 1

我发现这方面的文档非常不稳定。我通过查看this demo的来源找到了它。

首先，您需要包含以下依赖项：

• jquery的
• jquery.ui.widget
• load-image（来自https://github.com/blueimp/JavaScript-Load-Image）
• load-image-meta（来自https://github.com/blueimp/JavaScript-Load-Image）
• canvas-to-blob（来自https://github.com/blueimp/JavaScript-Canvas-to-Blob）
• jquery.iframe传输
• jquery.fileupload
• jquery.fileupload过程
• jquery.fileupload图像

然后你可以将预览图像插入到DOM中（在CoffeeScript中）：

$(...).fileupload().on 'fileuploadprocessalways', (e, data) ->
  file = data.files[data.index]
  if file.preview?
    myContainer.append(file.preview)

如果它不起作用，请仔细检查您是否已包含所有依赖项的最新版本。