设为首页 收藏本站
查看: 459|回复: 0

[经验分享] php jquery 上传照片,上传后实时本页面预览

[复制链接]

尚未签到

发表于 2017-4-9 07:06:35 | 显示全部楼层 |阅读模式
  其实这个的主要部分并不是一个jquery,但是必须使用到
php程序部分,也只需要这个一个php程序就可以了
www.corange.cn亲测
<?php
header("Content-Type: text/html; charset=utf-8");
@header( "Cache-Control: no-cache, must-revalidate" );
@header( "Pragma: no-cache" );
@header( "Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" );
  if($_GET['act']=='upload'){
if($_POST['upload']=='upload'){
  $updir ='upload/';
$uploadfile = $uploaddir . basename($_FILES['file']['name']);
  $_FILES['file']['name']=strtolower($_FILES['file']['name']);
$tmp_filename=explode(".",$_FILES['file']['name']);
if($tmp_filename[(count($tmp_filename)-1)]=='jpg' || $tmp_filename[(count($tmp_filename)-1)]=='jpeg'){
$up_filename=$updir.md5($_FILES['file']['name'].$_FILES['file']['size']).".".$tmp_filename[(count($tmp_filename)-1)] ;
  if(move_uploaded_file($_FILES['file']['tmp_name'],$up_filename)){
list($width, $height, $type, $attr) = getimagesize($up_filename);
$f1="<img src='$up_filename' id='ImageDrag' width='150'>";
echo '<script language="javascript">parent.$("#ImageDragContainer").html("'.$f1.'");</script>';
echo "<script>parent.myform.bigpic.value=''</script>";//修改时候直接替换掉原数据
echo "<script>parent.myform.bigpic.value+='",$up_filename,",",$width,",",$height,"'</script>";
echo "<script>location.href='?act=upload'</script>";exit;
}else{
echo "<script>alert('图片上传失败!');location.href='?act=upload'</script>";exit;
}
}else{
echo "<script>alert('图片上传失败,请注意上传格式,只支持jpg格式图片!');location.href='?act=upload'</script>";exit;
}
  
}
?>
<body style="padding:0px;margin:0px;">
<div style="margin:0px;padding:0px;font-size:12px;">
<FORM ACTION="?act=upload" METHOD="POST" enctype="multipart/form-data">
  <input type="file" name="file" id="file" />
  <input type="submit" name="button" id="button" value="上传" />
  <input name="upload" type="hidden" id="upload" value="upload" /><input type="hidden" name="MAX_FILE_SIZE" value="3000000" />
</FORM>
  </div>
</body>
<?php
exit;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>上传照片,上传后可以预览-www.corange.cn 网站开发代码</title>
<script src="js/jquery.pack.js"></script>
</head>
  <body>
<form action="upload_ok.php" name="myform">
<table width="700" border="0" cellpadding="3" cellspacing="1">
<tr>
<td width="250" valign="top" bgcolor="#FFFFFF">
<div id="ImageDragContainer">
  </div>
  </td>
<td valign="top" bgcolor="#FFFFFF">
<br><br>
<iframe frameborder=0 style="width:350px;height:50px;padding:0px;border:0px;background:#fff" src="?act=upload"></iframe><textarea cols="60" name="bigpic" rows="1" id="IconContainer"></textarea>
</td>
</tr>
</table>
<input name="" type="submit" />
</form>
</html>
Jquery请自行下载后测试


  Jquery请自行下载后测试 原文地址:http://www.corange.cn/archives/2010/04/3603.html

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-362173-1-1.html 上篇帖子: PHP中多张图片上传并校验的实现 下篇帖子: php __call()与call_user_func_array()理解
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表