Home >Backend Development >PHP Tutorial >How to upload images using php html5 ajax, _PHP tutorial

How to upload images using php html5 ajax, _PHP tutorial

WBOY
WBOYOriginal
2016-07-12 08:52:00775browse

php html5 ajax implements the method of uploading images,

This article describes the example of php html5 ajax implementing the method of uploading images. Share it with everyone for your reference, the details are as follows:

<&#63;php
if (isset($_POST['upload'])) {
  var_dump($_FILES);
  move_uploaded_file($_FILES['upfile']['tmp_name'], 'up_tmp/'.time().'.dat');
  //header('location: test.php');
  exit;
}
&#63;>

<!doctype html>
<html lang="zh">
<head>
  <meta charset="utf-8">
  <title>HTML5 Ajax Uploader</title>
  <script src="jquery-2.1.1.min.js"></script>
</head>
<body>
<p><input type="file" id="upfile"></p>
<p><input type="button" id="upJS" value="用原生JS上传"></p>
<p><input type="button" id="upJQuery" value="用jQuery上传"></p>
<script>
  /*原生JS版*/
  document.getElementById("upJS").onclick = function() {
    /* FormData 是表单数据类 */
    var fd = new FormData();
    var ajax = new XMLHttpRequest();
    fd.append("upload", 1);
    /* 把文件添加到表单里 */
    fd.append("upfile", document.getElementById("upfile").files[0]);
    ajax.open("post", "test.php", true);
    ajax.onload = function () {
      console.log(ajax.responseText);
    };
    ajax.send(fd);
  }
  /* jQuery 版 */
  $('#upJQuery').on('click', function() {
    var fd = new FormData();
    fd.append("upload", 1);
    fd.append("upfile", $("#upfile").get(0).files[0]);
    $.ajax({
      url: "test.php",
      type: "POST",
      processData: false,
      contentType: false,
      data: fd,
      success: function(d) {
        console.log(d);
      }
    });
  });
</script>
</body>
</html>

Readers who are interested in more PHP related content can check out the special topics of this site: "Summary of PHP File Operations", "Summary of PHP Operations and Operator Usage", "Summary of PHP Network Programming Skills", "Introduction Tutorial on PHP Basic Grammar" ", "Summary of PHP office document operation skills (including word, excel, access, ppt)", "Summary of PHP date and time usage", "Introduction to PHP object-oriented programming tutorial", "Summary of PHP string (string) usage" , "Introduction Tutorial on PHP MySQL Database Operation" and "Summary of Common PHP Database Operation Skills"

I hope this article will be helpful to everyone in PHP programming.

www.bkjia.comtruehttp: //www.bkjia.com/PHPjc/1127904.htmlTechArticlephp html5 ajax implements the method of uploading images. This article illustrates the method of php html5 ajax implementing uploading images. Share it with everyone for your reference, the details are as follows: phpif (isset($_POST['...
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn