Heim > Artikel > Backend-Entwicklung > PHP implementiert die Avatar-Upload-Vorschau-Funktion_php-Beispiel

PHP implementiert die Avatar-Upload-Vorschau-Funktion_php-Beispiel

墨辰丷Original: 2018-05-23 14:19:191941Durchsuche

Dieser Artikel stellt hauptsächlich die relevanten Informationen von PHP zur Implementierung der Avatar-Upload-Vorschaufunktion im Detail vor. Interessierte Freunde können sich auf

Hauptseite 1.php

beziehen

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上传头像</title>
<style type="text/css">
  *{
    font-family:"微软雅黑";}
  #zong{
    /*border:1px solid black;*/
    position:relative;
    width:52%;
    height:500x;
    left:24%}
  .nr{
    float:left;
    margin-right:30px;}
  #yl{width:240px; height:240px; background-size:240px 240px;}
  #file{width:240px; height:240px; float:left; opacity:0;}
</style>
</head>

<body>

<p id="zong">
<form id="sc" action="2.php" method="post" enctype="multipart/form-data" target="shangchuan">
  
  <input type="hidden" name="tp" value="" id="tp" />
  
  <p id="yl" style="background-image:url(./image/1.jpg)" class="nr">//头像显示的位置
    <input type="file" name="file" id="file" onchange="document.getElementById(&#39;sc&#39;).submit()" />
  </p>
  <p class="nr">
  </p> 
</form>

<iframe style="display:none" name="shangchuan" id="shangchuan">
</iframe>

</p>
</body>

<script type="text/javascript">

//回调函数,调用该方法传一个文件路径，改变背景图
function showimg(url)
{
  var p = document.getElementById("yl");
  p.style.backgroundImage = "url("+url+")";
  
  document.getElementById("tp").value = url;
}

</script>

</html>

Verarbeitungsseite 2.php

<?php
session_start();
$uid = $_SESSION["uid"];
if($_FILES["file"]["error"])
{
  echo $_FILES["file"]["error"];
}
else
{
  if(($_FILES["file"]["type"]=="image/jpeg" || $_FILES["file"]["type"]=="image/png")&& $_FILES["file"]["size"]<1024000)
  {
    $fname = "./a/image/".date("YmdHis").$_FILES["file"]["name"];  //头像存储的路径
    
    $filename = iconv("UTF-8","gb2312",$fname);
    
    if(file_exists($filename))
    {
      echo "<script>alert(&#39;该文件已存在！&#39;);</script>";
    }
    else
    {
      move_uploaded_file($_FILES["file"]["tmp_name"],$filename);
      
      unlink($_POST["tp"]);
      echo "<script>parent.showimg(&#39;{$fname}&#39;);</script>";
    }
    
  }
}

Anzeige öffnen:

Klicken Sie auf den Bildort, um das Auswahlfeld aufzurufen:

Nachdem Sie das Bild ausgewählt haben:

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für das Studium aller hilfreich sein wird.

Verwandte Empfehlungen:

PHPDer Unterschied zwischen abstrakten und interface_javascript-Kenntnissen

php zeigt die Datei an, in der sich die aktuelle Datei befindet, und alle Dateien im Ordner werden in einer Baumform erweitert._Javascript-Fähigkeiten

Beispiel für PHP-domänenübergreifend Aufruf von json _jquery

Das obige ist der detaillierte Inhalt vonPHP implementiert die Avatar-Upload-Vorschau-Funktion_php-Beispiel. 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：So generieren Sie Miniaturansichten und zeigen sie mit ThinkPHP anNächster Artikel：So generieren Sie Miniaturansichten und zeigen sie mit ThinkPHP an

In Verbindung stehende Artikel

Mehr sehen