Comment utiliser ajax pour télécharger des images et télécharger des images sans actualiser en PHP

墨辰丷
Libérer: 2023-03-27 21:24:02
original
1357 Les gens l'ont consulté

Cet article partagera avec vous le code d'implémentation de la fonction de téléchargement d'images et de téléchargement d'images sans actualisation de php ajax. Il est très bon et a une valeur de référence. Les amis qui en ont besoin peuvent s'y référer

php ajax. téléchargement d'image sans rafraîchissement et téléchargement d'image Le code d'implémentation de la fonction est le suivant :

<meta charset="utf-8" > 
    <form id= "uploadForm">  
       <p >指定文件名: <input type="text" name="filename" value= ""/></p >  
        <p> 
         上传文件:  
         <input type="file" name="photo" onchange="showPreview(this)" class="file" /> 
         <img id="portrait" src="" width="70" height="75"> 
       </p>  
       <input type="button" value="上传" onclick="doUpload()" />  
    </form>  
    <script src="http://www.haoyunyun.cn/jquery.js"></script> 
    <script> 
    function doUpload() {  
       var formData = new FormData($( "#uploadForm" )[0]);  
       $.ajax({  
         url: &#39;submit.php&#39; ,  
         type: &#39;POST&#39;,  
         data: formData,  
         async: false,  
         cache: false,  
         contentType: false,  
         processData: false,  
         success: function (returndata) {  
           alert(returndata);  
         },  
         error: function (returndata) {  
           alert(returndata);  
         }  
       });  
    }  
    </script> 
    <script type="text/javascript"> 
    function showPreview(source) { 
      var file = source.files[0]; 
      if (window.FileReader) { 
        var fr = new FileReader(); 
        fr.onloadend = function(e) { 
          document.getElementById("portrait").src = e.target.result; 
        }; 
        fr.readAsDataURL(file); 
      } 
    } 
   </script>
Copier après la connexion

submit.php

<?php 
  if($_FILES[&#39;photo&#39;][&#39;error&#39;]>0){ 
    echo "上传文件失败"; 
    die; 
  } 
  $dir=&#39;./photo/&#39;; 
  $type=substr($_FILES[&#39;photo&#39;][&#39;name&#39;],strrpos($_FILES[&#39;photo&#39;][&#39;name&#39;],&#39;.&#39;)); 
  $filename=time().rand(1000,9999).$type; 
  if(is_uploaded_file($_FILES[&#39;photo&#39;][&#39;tmp_name&#39;])){ 
    move_uploaded_file($_FILES[&#39;photo&#39;][&#39;tmp_name&#39;],$dir.$filename); 
    echo "上传成功"; 
  }else{ 
    echo "上传文件失败"; 
  }
Copier après la connexion

Données de la base de données de parcours

 <?php 
  header("content-type:text/html;charset=utf-8"); 
  $link=mysql_connect("127.0.0.1",&#39;root&#39;,&#39;root&#39;); 
  mysql_select_db("php9",$link); 
  mysql_query("set names utf8"); 
  //查询数据中的总条数 
  $sql="select count(id) as count from upload"; 
  $arr=mysql_query($sql); 
  $result=mysql_fetch_assoc($arr); 
  //获得总条数 
  $size=$result[&#39;count&#39;]; 
  //每页显示2条数据 
  $length=6; 
  //计算出多少页 
  $pages=ceil($size/$length); 
  $page=isset($_GET[&#39;page&#39;])?$_GET[&#39;page&#39;]:1; 
  if($page<=0){ 
    $page=1; 
  } 
  if($page>$pages){ 
    $page=$pages; 
  } 
  //数据从第几条开始 
  $start=($page-1)*$length; 
  $sql="select * from upload limit $start,$length"; 
  $res=mysql_query($sql); 
  ?> 
  <center> 
  <table border="1"> 
    <p> 
      <?php 
      while($a=mysql_fetch_assoc($res)){ 
        ?> 
        <ul> 
          <li><?php echo $a[&#39;id&#39;] ?></li> 
          <li><?php echo $a[&#39;username&#39;] ?></li> 
          <li><a href="photo.php" rel="external nofollow" ><img src="<?php echo $a[&#39;dir&#39;] ?>" width="80px" ></a> </li> 
          <li><?php echo $a[&#39;desc1&#39;] ?></li> 
          <li> 
            <a href="photo3.php?dir=<?php echo $a[&#39;dir&#39;] ?>" rel="external nofollow" >下载</a> 
            <a href="photo4.php?id=<?php echo $a[&#39;id&#39;] ?> && dir=<?php echo $a[&#39;dir&#39;] ?>" rel="external nofollow" >删除</a> 
          </li> 
        </ul> 
      <?php 
      } 
      ?> 
    </p> 
  </table> 
              <a href="photo2.php?page=1" rel="external nofollow" >首页</a> 
              <a href="photo2.php?page=<?php echo $page-1 ?>" rel="external nofollow" >上一页</a> 
              <a href="photo2.php?page=<?php echo $page+1 ?>" rel="external nofollow" >下一页</a> 
              <a href="photo2.php?page=<?php echo $pages ?>" rel="external nofollow" >尾页</a> 
  </center> 
  <style> 
    *{ 
      margin: 0; 
      padding: 0; 
    } 
    p{ 
      width:900px; 
      height: 850px; 
      border: 1px solid #28a4c9; 
      margin: auto; 
    } 
    img{ 
      width: 200px; 
      height: 130px; 
      margin-left: 100px; 
    } 
    ul{ 
      width: 400px; 
      height: 300px; 
      float: left; 
    } 
    li{ 
      list-style: none; 
      margin-left: 10px; 
    } 
  </style>
Copier après la connexion

Code de téléchargement

 <?php 
  header("content-type:text/html;charset=utf-8"); 
  $dir=$_GET[&#39;dir&#39;]; 
  $filename=substr($dir,strrpos($dir,&#39;/&#39;)+1); 
  header("Content-type:image"); 
  header("content-disposition:attachment;filename=$filename"); 
  readfile($dir); 
  ?>
Copier après la connexion

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 Cliquez sur le lienTéléchargement d'imagesCode du programme

Comment obtenir un téléchargement d'image à distance en php et l'enregistrer localement

Télécharger une image Ajax sans actualisation en PHP et téléchargement d'imagesFonction

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal