php头像上传预览实例代码

开发技术作者： 2024-08-17 11:05:01

本篇文章主要介绍了php头像上传预览实例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

说道上传图片，大家并不陌生，不过，在以后开发的项目中，可能并不会让你使用提交刷新页面式的上传图片，比如上传头像，按照常理，肯定是在相册选择照片之后，确认上传，而肯定不会通过form表单，点击submit刷新式上传。我为大家介绍两种异步非刷新式上传图片+图片预览：第一种，通过现成的uploadfy插件进行上传，网上好多实例。

不过我重点为大家介绍的是第二种，通过Ajax上传图片。因为使用uploadfy插件需要设备支持swf格式的Flash，所以对大多数手机来说，第一种方式就没办法使用了。首先，我先跟大家说一下上传原理：通过js控制file文本域，当选择照片之后，通过Ajax异步提交form表单，然后将图片的位置作为返回值，使用js把img的src属性设置为返回值。

上传头像区域：

代码：

无标题文档

yl{ width:200px; height:200px; background-image:url(img/avatar.png); background-size:200px 200px;}

file{ width:200px; height:200px; float:left; opacity:0;}

.modal-content{ width:500px;}
.kk{ margin-left:130px;}

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

document.getElementById("tp").value = url;
}

上传的处理页：

if($_FILES["file"]["error"])
{
echo $_FILES["file"]["error"];
}
else
{
if(($_FILES["file"]["type"]=="image/jpeg" || $_FILES["file"]["type"]=="image/png")&& $_FILES["file"]["size"]<1024000000)
{
$fname = "./img/".date("YmdHis").$_FILES["file"]["name"];

$filename = iconv("UTF-8","gb2312",$fname);

if(file_exists($filename))
{
  echo "@H_<a href="https://www.jb51.cc/tag/403/" target="_blank" class="keywords">403</a>_45@alert('该<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>已存在！');</script>";
}
else
{
  move_uploaded_file($_FILES["file"]["tmp_name"],$filename);

  unlink($_POST["tp"]);

  echo "@H_<a href="https://www.jb51.cc/tag/403/" target="_blank" class="keywords">403</a>_45@parent.showimg('{$fname}');</script>";
}

}
}

原理：

通过form表单的enctype="multipart/form-data"属性将文件临时放到wamp文件夹中的tmp目录下，再通过后台PHP程序将文件保存在体统中。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

原创声明

本站部分文章基于互联网的整理，我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。

本文链接：http://www.jiecseo.com/news/show_63752.html

相关资讯： php头像上传预览 php头像上传 php上传头像实例