如何在上传成功后显示缩略图

Question

我有一个带输入类型文件的表单，如果单击了按钮，图像应该开始上传，进度条显示状态，现在我想显示这个图像的缩略图，还有一个PHP（ControllerImage）一个方法（myImagebut）检查文件是否是有效图像，我的想法是，该方法是否返回一个真正的变量，允许在index.php上显示缩略图，否则不显示任何缩略图。

这是我的表格：

<div>
    <input type='file' name='img1' id='img1' onchange="uploadFile()">

    <progress id="progressBar" value="0" max="100" style="width:100%; height:15px;"></progress>
</div>
<tt id="status"></tt>
<br />


//index.php

function uploadFile(){
    cat = 5;
    var2= par1+'_'+par2;

    var file = _("img1").files[0];
    var e = document.getElementById("img1");
    var formdata = new FormData();
    formdata.append("img1", file);

    var ajax = new XMLHttpRequest();
    ajax.upload.addEventListener("progress", progressHandler, false);
    ajax.addEventListener("load", completeHandler, false);
    ajax.addEventListener("error", errorHandler, false);
    ajax.addEventListener("abort", abortHandler, false);
    ajax.open("POST", '/ControllerImage/myImage/img1/'+var2+'/'+cat+'/'+1+'/');
    ajax.send(formdata);
    formdata.delete("img1");
    formdata = '';
}

function progressHandler(event){
    var percent = (event.loaded / event.total) * 100;
    _("progressBar").value = Math.round(percent);
}

function completeHandler(event){
    _("status").innerHTML = event.target.responseText;
    _("progressBar").value = 0;
    $("#progressBar").css({ 'background': 'Orange' });
}

function errorHandler(event){
    _("status").innerHTML = "upload failed";
}

function abortHandler(event){
    _("status").innerHTML = "upload interrumpted";
}