jquery - jquery文件上传预览大拇指

Question

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

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

Answer 1

我发现这方面的文档非常参差不齐。我通过查看此演示的源代码发现了这一点。

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

• jQuery
• jquery.ui.widget
• 加载图像（来自https://github.com/blueimp/JavaScript-Load-Image）
• 加载图像元（来自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-image

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

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

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