php ajax无刷新上传图片与图片下载功能的实现代码如下所示:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
<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.zzvips.com/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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<?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 "上传文件失败" ;
}
|
遍历数据库数据
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
<?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>
|
下载代码
1
2
3
4
5
6
7
8
|
<?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无刷新上传图片与图片下载功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对服务器之家网站的支持!
原文链接:http://blog.csdn.net/xkweiguang/article/details/52779382