Méthodes et exemples de téléchargement d'images en utilisant php+html5+ajax-tutoriel php-php.cn

Méthodes et exemples de téléchargement d'images en utilisant php+html5+ajax

墨辰丷

Libérer： 2023-03-29 13:56:02

original

1196 Les gens l'ont consulté

Cet article présente principalement la méthode php+html5+ajax pour télécharger des images, et compare et analyse les deux méthodes d'appel ajax pour télécharger des images, js native et jQuery, ainsi que le traitement de téléchargement d'images php et d'autres techniques. qui en ont besoin peuvent s'y référer

Les détails sont les suivants :

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

Copier après la connexion

<!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 版 */
  $(&#39;#upJQuery&#39;).on(&#39;click&#39;, 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>

Copier après la connexion

Résumé : Ce qui précède représente l'intégralité du contenu de cet article, j'espère qu'il sera utile à l'étude de chacun.

Recommandations associées :

PHP implémente la méthode d'écriture des classes PDO basée sur le mode singleton

PHP génère Tencent Cloud COS interface Signature de demande requise

Explication détaillée de l'exemple de téléchargement d'aperçu multi-images WeChat d'imitation PHP

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!