Question

以下是我们尝试将文件附加到的html元素：

<input id="uploaded_file_file_for_upload" class="file optional" type="file" name="uploaded_file[file_for_upload]">

用户已经为上面的元素选择了一个文件。我们需要做的是删除当前文件选择并将新文件附加到它。新文件是图像文件，保存在canvas元素中。这是新文件的js代码：

 function resize(image, width, height) {
      var mainCanvas = document.createElement("canvas");
      mainCanvas.width = width;
      mainCanvas.height = height;
      var ctx = mainCanvas.getContext("2d");
      alert(width + '    resize to    ' + height);
      ctx.drawImage(image, 0, 0, width, height);
  .....(remove current and attach the new file to the elelment#uploaded_file_file_for_upload)
   };

我们尝试了以下附件，但没有用：

$('#uploaded_file_file_for_upload').attr('src', mainCanvas.toDataURL("image/jpeg"));

问题可能在于它不是图像元素。删除和附加文件类型的正确方法是什么？感谢。

Answer 1

简短的回答是你不能。上传文件的唯一方法是发送用户选择的文件，不做任何更改。

在这里完成您要做的事情的唯一方法是使用：

原生应用
带有原生插件的混合应用
通过浏览器插件（flash，chrome app ...）

除非，浏览器安全策略会阻止您。

可能有两种解决方法：

发送原始文件并调整服务器端（php库，nodejs ...）
或根据需要调整图像大小，然后通过POST ajax请求将编辑过的图像的base64编码图像数据上传到服务器，然后将其写入文件服务器端。

如何将文件附加到html＆＃39;文件＆＃39;用jquery / js上传的元素？

1 个答案: