PHP中ajax无刷新上传图片与图片下载功能

php ajax无刷新上传图片与图片下载功能的实现代码如下所示:

<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: 'submit.php' , type: 'POST', 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>

submit.php

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

遍历数据库数据

<?php header("content-type:text/html;charset=utf-8"); $link=mysql_connect("127.0.0.1",'root','root'); 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['count']; //每页显示2条数据 $length=6; //计算出多少页 $pages=ceil($size/$length); $page=isset($_GET['page'])?$_GET['page']: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"> <div> <?php while($a=mysql_fetch_assoc($res)){ ?> <ul> <li><?php echo $a['id'] ?></li> <li><?php echo $a['username'] ?></li> <li><a href="photo.php" rel="external nofollow" ><img src="<?php echo $a['dir'] ?>" width="80px" ></a> </li> <li><?php echo $a['desc1'] ?></li> <li> <a href="photo3.php?dir=<?php echo $a['dir'] ?>" rel="external nofollow" >下载</a> <a href="photo4.php?id=<?php echo $a['id'] ?> && dir=<?php echo $a['dir'] ?>" rel="external nofollow" >删除</a> </li> </ul> <?php } ?> </div> </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; } div{ 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>

下载代码

<?php header("content-type:text/html;charset=utf-8"); $dir=$_GET['dir']; $filename=substr($dir,strrpos($dir,'/')+1); header("Content-type:image"); header("content-disposition:attachment;filename=$filename"); readfile($dir); ?>

以上所述是小编给大家介绍的PHP中ajax无刷新上传图片与图片下载功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

时间: 2024-09-11 04:44:40

PHP中ajax无刷新上传图片与图片下载功能的相关文章

php+ajax无刷新上传图片的实现方法_php技巧

本文实例讲述了php+ajax无刷新上传图片的实现方法.分享给大家供大家参考,具体如下: 1.引入文件 <!--图片上传begin--> <script type="text/javascript" src="/js/jquery.form.js"></script> <script type="text/javascript" src="/js/uploadImg.js">&l

swfupload ajax无刷新上传图片实例代码_实用技巧

最近自己做项目的时候需要添加一个功能,上传用户的图片,上传用户图片其实涉及到很多东西,不只是一个html标签<input id="File1" type="file" />或者asp.net封住好的FileUpload 控件,现在网站不再讲究的是功能性,更多的是用户体验性,在这里上传图片就需要用到ajax无刷新上传图片,这里面包含的东西不是一点半点.这里用到的是一个插件swfupload 实现无刷新上传图片.直接上传我的代码供大家参考. 前台代码区: 复

php+ajax无刷新上传图片实例代码_php技巧

本文分享了php结合ajax实现无刷新上传图片的实例代码,分享给大家,希望大家可以和小编一起学习学习,共同进步. 1.引入文件 <!--图片上传begin--> <script type="text/javascript" src="/js/jquery.form.js"></script> <script type="text/javascript" src="/js/uploadImg.js

Android中Glide实现超简单的图片下载功能

本文介绍了Glide实现超简单的图片下载功能,具体步骤如下: 添加依赖 compile 'com.github.bumptech.glide:glide:3.7.0' 添加权限 <uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/&

PHP AJAX无刷新上传图片实例

将index.html和upload.php文件保存到apache工作目录,例子使用安装目录D:/Program Files/Apache Software Foundation/Apache2.2/htdocs/ AJAX 客户端页面代码: index.html <html> <body> <h1>Ajax file upload sample</h1><br/><input id="uplaod" name=&quo

php ajax无刷新上传图片实例代码

将index.html和upload.php文件保存到支持php的空间的同级目录,测试运行即可 AJAX 客户端页面代码: index.html   <html> <body> <h1>Ajax file upload sample</h1><br/><input id="uplaod" name="btn_send" type="button" value="上传测试&

使用SWFUpload实现无刷新上传图片

  现在网站不再讲究的是功能性,更多的是用户体验性,在这里上传图片就需要用到ajax无刷新上传图片,这里面包含的东西不是一点半点 .这里用到的是一个插件swfupload 实现无刷新上传图片 在做项目时,需要用到一个图片的无刷新上传,之前听说过SWFUpload,于是想要通过SWFUpload来进行图片的无刷新上传,由于我的项目属于是ASP.NET项目,所以本文着重讲解ASP.NET 的使用,个人感觉示例基本给的很清晰,参考文档进行开发,并非难事 0. 首先下载swfUpload 包,在下载的包

PHP+Ajax无刷新带进度条图片上传示例

项目需求:1.PHP+Ajax无刷新带进度条图片上传,2.带进度条.所需插件:jquery.js,jquery.form.js. 最近在做一个手机web项目,需要用到Ajax上传功图片能,项目要求PHP无刷新上传图片,并且要带进度条,下面就来讲一下我的实现方法,先看效果图 本示例需要使用的是jquery.js,jquery.form.js,demo里面包含有,你可以在文章下方进行下载. 第一步,建立前端页面index.html 此段是前端展示内容,这里需要说明的是由于input:file标签显示

spring mvc+mybatis框架使用怎么ajax无刷新批量上传图片?

问题描述 spring mvc+mybatis框架使用怎么ajax无刷新批量上传图片? spring mvc+mybatis框架怎么使用ajax无刷新批量上传图片?上传之后显示,哪位大神能不能给个demo,谢谢! 解决方案 Mvc Ajax 图片上传