Ajax提交表单并检索URL

时间:2019-01-22 17:26:47

标签: php ajax

我已经花了几个小时了,我无法弄清楚,所以请帮忙。

我想做的就是使用ajax在index.php中提交表格到upload.php并检索上传的文件URL,以便我可以显示缩略图。

然后在缩略图下方再次出现表单,以上传其他图像。这应该持续三遍。因为图像限制为三个。缩略图应保留到最后。 (请看图片)

enter image description here

我的index.php

++i

我的upload.php

<form action="upload.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>

谢谢。

1 个答案:

答案 0 :(得分:0)

您可以通过Ajax完成此操作。...直接在文件图像中卸载的JavaScript可以通过Ajax使用JavaScript完成此操作 从服务器端回显您的网址,它将发送回您的客户端页面,在该页面中,您可以使用JavaScript显示缩略图(如果您不了解和 如果您需要详细的代码,请问我

//First add id to form like formid
//Next code
var formid = document.getElementById('formid');
   fileToUpload = new FormData(formid);
xhttp = new XMLHttpRequest ();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     document.getElementById("img_id").innerHTML = this.responseText;//here img_id is id for img element where you want to show thumbnail
    }
  };
  xhttp.open("POST", "upload.php", true);// if you want to send by get method then write get inside of post
  xhttp.send(fileToUpload);

// Important !!!! form php page echo complete location of thumbnail