php图片上传,可实现预览

php教程图片上传,可实现预览

<?php
header("content-Type: text/html; charset=gb2312");
$uptypes=array('image/jpg',  //上传文件类型列表
 'image/jpeg',
 'image/png',
 'image/pjpeg',
 'image/gif',
 'image/bmp',
 'application/x-shockwave-flash',
 'image/x-png',
 'application/msword',
 'audio/x-ms-wma',
 'audio/mp3',
 'application/vnd.rn-realmedia',
 'application/x-zip-compressed',
 'application/octet-stream');

$max_file_size=10000000;   //上传文件大小限制, 单位BYTE
$path_parts=pathinfo($_SERVER['PHP_SELF']); //取得当前路径
$destination_folder="up/"; //上传文件路径
$watermark=0;   //是否附加水印(1为加水印,0为不加水印);
$watertype=1;   //水印类型(1为文字,2为图片)
$waterposition=2;   //水印位置(1为左下角,2为右下角,3为左上角,4为右上角,5为居中);
$waterstring="www.yinao.tk"; //水印字符串
$waterimg="xplore.gif";  //水印图片
$imgpreview=1;   //是否生成预览图(1为生成,0为不生成);
$imgpreviewsize=1/1;  //缩略图比例
?>
<html xmlns="undefined">
<head>
<title>图片上传储存</title>
<style type="text/css教程">
body,td{font-family:tahoma,verdana,arial;font-size:11px;line-height:15px;background-color:white;color:#666666;
strong{font-size:12px;}
a:link{color:#0066CC;}
a:hover{color:#FF6600;}
a:visited{color:#003366;}
a:active{color:#9DCC00;}
a{TEXT-DECORATION:none}
td.irows{height:20px;background:url("index.php?i=dots") repeat-x bottom}
</style>
</head>
<script type="text/网页特效">function oCopy(obj){obj.select();js=obj.createTextRange();js.execCommand("Copy");};function sendtof(url){window.clipboardData.setData('Text',url);alert('复制地址成功,粘贴给你好友一起分享。');};function select_format(){var on=document.getElementById('fmt').checked;document.getElementById('site').style.display=on?'none':'';document.getElementById('sited').style.display=!on?'none':'';};var flag=false;function DrawImage(ImgD){var image=new Image();image.src=ImgD.src;if(image.width>0&&image.height>0){flag=true;if(image.width/image.height>=120/80){if(image.width>120){ImgD.width=120;ImgD.height=(image.height*120)/image.width;}else {ImgD.width=image.width;ImgD.height=image.height;};ImgD.alt=image.width+"×"+image.height;}else {if(image.height>80){ImgD.height=80;ImgD.width=(image.width*80)/image.height;}else {ImgD.width=image.width;ImgD.height=image.height;};ImgD.alt=image.width+"×"+image.height;}};};function FileChange(Value){flag=false;document.all.uploadimage.width=10;document.all.uploadimage.height=10;document.all.uploadimage.alt="";document.all.uploadimage.src=Value;};</script>
<body bgcolor="#FFFFFF">
<center>
  <form enctype="multipart/form-data" method="post" name="upform">
    <table border="1" width="55%" id="table1" cellspacing=0>
      <tr>
        <td colspan="2"><p align="center">最大文件限制1M </td>
      </tr>
      <tr>
        <td width="10%"><div style="width:120px; height:80px;overflow:hidden;text-align: center;" ><IMG id=uploadimage height=0 width=0 src=""  onload="javascript:DrawImage(this);" ></div></td>
        <td width="71%"><div style="width:361px; height:80px;overflow:hidden;text-align: center;padding:30px; " >
          <input style="width:208;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff; height:18" size="17" name=upfile type=file
onchange="javascript:FileChange(this.value);">
          <input type="submit" value="上传" style="width:60;border:1 solid #9a9999; font-size:9pt; background-color:#ffffff; height:18" size="17"></td>
      </tr>
    </table>
    允许上传的文件类型为:jpg|jpeg|gif|bmp|png|swf|mp3|wma|zip|rar|doc</form>
  <?php
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
if (!is_uploaded_file($_FILES["upfile"][tmp_name]))
//是否存在文件
{
echo "<font color='red'>文件不存在!</font>";
exit;
}

 $file = $_FILES["upfile"];
 if($max_file_size < $file["size"])
 //检查文件大小
 {
 echo "<font color='red'>文件太大!</font>";
 exit;
  }

if(!in_array($file["type"], $uptypes))
//检查文件类型
{
 echo "<font color='red'>不能上传此类型文件!</font>";
 exit;
}

if(!file_exists($destination_folder))
mkdir($destination_folder);

$filename=$file["tmp_name"];
$image_size = getimagesize($filename);
$pinfo=pathinfo($file["name"]);
$ftype=$pinfo[extension];
$destination = $destination_folder.time().".".$ftype;
if (file_exists($destination) && $overwrite != true)
{
     echo "<font color='red'>同名文件已经存在了!</a>";
     exit;
  }

 if(!move_uploaded_file ($filename, $destination))
 {
   echo "<font color='red'>移动文件出错!</a>";
     exit;
  }

$pinfo=pathinfo($destination);
$fname=$pinfo[basename];
echo " <font color=red>成功上传,鼠标移动到地址栏自动复制</font><br><table width="348" cellspacing="0" cellpadding="5" border="0" class="table_decoration" align="center"><tr><td><input type="checkbox" id="fmt" onclick="select_format()"/>图片UBB代码<br/><div id="site"><table border="0"><tr><td valign="top">文件地址:</td><td><input type="text" onclick="sendtof(this.value)" onmouseo教程ver="oCopy(this)" style=font-size=9pt;color:blue size="44" value="http://".$_SERVER['SERVER_NAME'].$path_parts["dirname"]."/".$destination_folder.$fname.""/>
</td></tr></table></div><div id="sited" style="display:none"><table border="0"><tr><td valign="top">文件地址:</td><td><input type="text" onclick="sendtof(this.value)" onmouseover="oCopy(this)" style=font-size=9pt;color:blue size="44" value="[img]http://".$_SERVER['SERVER_NAME'].$path_parts["dirname"]."/".$destination_folder.$fname."[/img]"/></td></tr></table></div></td></tr></table>";
echo " 宽度:".$image_size[0];
echo " 长度:".$image_size[1];
if($watermark==1)
{
$iinfo=getimagesize($destination,$iinfo);
$nimage=imagecreatetruecolor($image_size[0],$image_size[1]);
$white=imagecolorallocate($nimage,255,255,255);
$black=imagecolorallocate($nimage,0,0,0);
$red=imagecolorallocate($nimage,255,0,0);
imagefill($nimage,0,0,$white);
switch ($iinfo[2])
{
 case 1:
 $simage =imagecreatefromgif($destination);
 break;
 case 2:
 $simage =imagecreatefromjpeg($destination);
 break;
 case 3:
 $simage =imagecreatefrompng($destination);
 break;
 case 6:
 $simage =imagecreatefromwbmp($destination);
 break;
 default:
 die("<font color='red'>不能上传此类型文件!</a>");
 exit;
}

imagecopy($nimage,$simage,0,0,0,0,$image_size[0],$image_size[1]);
imagefilledrectangle($nimage,1,$image_size[1]-15,80,$image_size[1],$white);

switch($watertype)
{
 case 1:  //加水印字符串
 imagestring($nimage,2,3,$image_size[1]-15,$waterstring,$black);
 break;
 case 2:  //加水印图片
 $simage1 =imagecreatefromgif("xplore.gif");
 imagecopy($nimage,$simage1,0,0,0,0,85,15);
 imagedestroy($simage1);
 break;
}

switch ($iinfo[2])
{
 case 1:
 //imagegif($nimage, $destination);
 imagejpeg($nimage, $destination);
 break;
 case 2:
 imagejpeg($nimage, $destination);
 break;
 case 3:
 imagepng($nimage, $destination);
 break;
 case 6:
 imagewbmp($nimage, $destination);
 //imagejpeg($nimage, $destination);
 break;
}

//覆盖原上传文件
imagedestroy($nimage);
imagedestroy($simage);
}

if($imgpreview==1)
{
echo "<br>图片预览:<br>";
echo "<a href="".$destination."" target='_blank'><img src="".$destination."" width=".($image_size[0]*$imgpreviewsize)." height=".($image_size[1]*$imgpreviewsize);
echo " alt="图片预览:r文件名:".$fname."r上传时间:".date('m/d/Y h:i')."" border='0'></a>";
}
}
?>
</center>
</body>
</html>

时间: 2024-10-06 07:21:38

php图片上传,可实现预览的相关文章

分离与继承的思想实现图片上传后的预览功能:ImageUploadView_javascript技巧

本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图.在实现这个组件的过程中,有用到前面几篇博客介绍的相关内容,比如继承库class.js,任意组件的事件管理库eventBase.js,同时包含进了自己对职责分离,表现与行为分离这两方面的一些思考,欢迎阅读与交流. 演示效果: 注:由于演示的代码都是静态的,所以文件上传的组件是用setTimeout模

jquery 图片上传按比例预览插件集合_jquery

js部分是这样的: 复制代码 代码如下: //**********************图片上传预览插件************************ //作者:IDDQD(2009-07-01) //Email:iddqd5376@163.com //http://blog.sina.com.cn/iddqd //版本:1.0 //说明:图片上传预览插件 //上传的时候可以生成固定宽高范围内的等比例缩放图 //参数设置: //width 存放图片固定大小容器的宽 //height 存放图片

jquery实现图片上传前本地预览功能_jquery

本文实例为大家分享了jquery实现图片上传前预览的具体代码,供大家参考,具体内容如下 介绍之前有一个小问题,一直找不到图片预览时,图片不出来的原因,原来在于图片的路径!!!一直写的是图片的本地路径,没有什么用.直接上代码. html部分: 复制代码 代码如下: <img id="pic" src="" > <input id="upload" name="file" accept="image/*

图片上传判断及预览脚本的效果实例_javascript技巧

复制代码 代码如下: <div id="imgbox">    <img id="imghead" src="img/no_photo.gif" alt="" width="100" height="125" />    </div><asp:FileUpload ID="FileUploadImg" runat="

51图片上传前的预览效果

提示:您可以先修改部分代码再运行 提示:您可以先修改部分代码再运行

Ajax上传图片及上传前先预览功能实例代码

手头上有几个小项目用到了easyUI,一开始决定使用easyUI就注定了项目整体上前后端分离,基本上所有的请求都采用Ajax来完成.在文件上传的时候用到了Ajax上传文件,以及图片在上传之前的预览效果,解决了这两个小问题,和小伙伴们分享下. 上传之前的预览 方式一 先来说说图片上传之前的预览问题.这里主要采用了HTML5中的FileReader对象来实现,关于FileReader对象,如果小伙伴们不了解,可以查看这篇文章HTML5学习之FileReader接口.我们来看看实现方式: <!DOCT

一次上传多张图片,并且上传前可以预览其缩略图 兼容IE7

问题描述 我想要一个,一次上传多张图片,并且上传前可以预览其缩略图兼容IE7的jquery插件 解决方案 解决方案二:js干不了这事,一般都是flush插件解决方案三:这需要插件.ActiveX.Silverlight.Flash都可以考虑.

小技巧:图片在上传之前先预览,无需先上传到服务器上

我在网上看到好多人问如何使用FileUpload上传之前,先预览图片,前提条件,不允许先上传到服务 器上!因为大多搜索的结果实现的方法都是先上传到服务器上,然后显示,如果不确定上传,就删除,这 样的风险太大,性能也消耗很大!下面的代码告诉大家我们不需要先把图片上传到服务器上就可以预览了 ,是不是很酷!不说了,上代码! <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

jsp中点击图片弹出文件上传界面及预览功能的实现_JSP编程

花了两天时间琢磨一下图片预览的功能 任务需求如下: 1:jsp页面中有一个图片(pic_1) 2:点击图片弹出类似于资源管理器的界面 3:选择完某一个图片之后在pic_1处预览 我在IE8上试验下面这段代码,可以实现上述功能,没有在别的浏览器中测试,如果各位朋友知道多种浏览器的支持方法,请赐教,共同学习,谢谢. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http: