suchen

Heim >Backend-Entwicklung >PHP-Tutorial >php+ajax+h5 implementiert die Funktion zum Hochladen von Bildern

php+ajax+h5 implementiert die Funktion zum Hochladen von Bildern

墨辰丷
墨辰丷Original
2018-05-17 14:41:041848Durchsuche

In diesem Artikel wird hauptsächlich die Implementierung der Ajax-Bild-Upload-Funktion im Detail vorgestellt. Interessierte Freunde können darauf verweisen.

Der spezifische Inhalt ist wie folgt

HTML-Seitencode

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script type="text/javascript" src="__PUBLIC__/home/js/jquery-1.11.0.js"></script>

</head>
<body>
<form class="form-horizontal" role="form" id="myForm"
   action="/index/fileupsend" method="post"
   enctype="multipart/form-data">

  选择文件:<input type="file" id="file1" /><br />
  <input type="button" id="upload" value="上传" />
  <span id="imgWait"></span>
</form>
<script>
  $(function () {
    $("#upload").click(function () {
      $("#imgWait").html("上传中");
      var formData = new FormData();
      formData.append("myfile", document.getElementById("file1").files[0]);
      $.ajax({
        url: "/Home/index/fileupsend",
        type: "POST",
        data: formData,
        /**
         *必须false才会自动加上正确的Content-Type
         */
        contentType: false,
        /**
         * 必须false才会避开jQuery对 formdata 的默认处理
         * XMLHttpRequest会对 formdata 进行正确的处理
         */
        processData: false,
        success: function (data) {
          if(data){
            alert("上传成功！");
          }
          $("#imgWait").html("上传成功");

        },
        error: function () {
          alert("上传失败！");
          $("#imgWait").hide();
        }
      });
    });
  });
</script>
</body>
</html>

PHP-Code

public function fileupsend(){
  $type_pic = $this->file_upload(&#39;1&#39;,array(&#39;jpg&#39;, &#39;gif&#39;, &#39;png&#39;, &#39;jpeg&#39;),&#39;filetest&#39;,&#39;myfile&#39;);
  echo $type_pic[&#39;img_path&#39;];

}

bezogen auf Empfohlen :

Probleme und Lösungen bei der Implementierung des einfachen Bild-Uploads in HTML5

thinkphp jquery implementiert den Bild-Upload und den Vorschaueffekt

Bild-Upload-Plug-in basierend auf ThinkPHP5.0

Das obige ist der detaillierte Inhalt vonphp+ajax+h5 implementiert die Funktion zum Hochladen von Bildern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Fallanalyse zum Betrieb der ThinkPHP-VerbindungsdatenbankNächster Artikel：Fallanalyse zum Betrieb der ThinkPHP-Verbindungsdatenbank

In Verbindung stehende Artikel

Mehr sehen