相关疑难解决方法(0)

我希望能够在上传之前预览文件(图像).预览操作应该在浏览器中全部执行,而不使用Ajax上传图像.

我怎样才能做到这一点？

我发现了一些不同的帖子,甚至还有关于stackoverflow回答这个问题的问题.我基本上和这篇文章一样实现了同样的东西.

所以这是我的问题.当我上传照片时,我还需要提交表单的其余部分.这是我的HTML:

<form id="uploadImageForm" enctype="multipart/form-data">
  <input name="imagefile[]" type="file" id="takePictureField" accept="image/*" onchange="uploadPhotos(\'#{imageUploadUrl}\')" />
  <input id="name" value="#{name}" />
  ... a few more inputs ... 
</form>

以前,我不需要调整图像大小,所以我的javascript看起来像这样:

window.uploadPhotos = function(url){
    var data = new FormData($("form[id*='uploadImageForm']")[0]);

    $.ajax({
        url: url,
        data: data,
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        success: function(data){
            ... handle error...
            }
        }
    });
};

这一切都很有效...现在我需要调整图像的大小......如何替换表单中的图像以便调整已调整大小的图像而不是上传的图像？

window.uploadPhotos = function(url){

    var resizedImage;

    // Read in file
    var file = event.target.files[0];

    // Ensure it's an image
    if(file.type.match(/image.*/)) {
        console.log('An image has …