首页 ??? 网页设计教程 ??? php+ajax文件上传进度条

php+ajax文件上传进度条

浏览数:共 494 次 ? ? 评论:共 0 条 ? ? 发布日期:2012-04-03 ? ? 分类:ajax


代码分为以下部分:
demo.php - 上传过程处理
plain textphp:
<?php

include ’uploadprogressmeter.class.php’;

$filewidget = new uploadprogressmeter();

if ($filewidget->uploadcomplete()) {
// 上传完毕的时候,从iframe发送一个js到主窗口表示一切ok
echo $filewidget->finalstatus();

// 处理上传后的文件...

exit;
}
?>
demoserver.php - ajax的服务端js,使用pear:html_ajax,直接调用uploadprogressmeterstatus类
plain texthtml:
<script src="http://img1.cssword.com/article/2012/0403/9465/1.php?client=main,request,httpclient,dispatcher,json,util" type="text/javascript"></script>
<script src="http://img1.cssword.com/article/2012/0403/9465/2.php?stub=uploadprogressmeterstatus" type="text/javascript"></script>
<?php echo $filewidget->renderincludejs(); ?>
进度条的样式表
plain textcss:
.progressbar {
position: relative;
padding: 2px;
width: 300px;
height: 40px;
font-size: 14px;
}
.progressbar .background {
border: solid 1px black;
width: 270px;
height: 20px;
}
.progressbar .bar {
position: relative;
background-color: blue;
width: 0px;
height: 20px;
}
表单部分
plain texthtml:
<form action="demo.php" method="post" enctype="multipart/form-data">renderformextra(); ?>>
<?php echo $filewidget->renderhidden(); ?></form><form action="demo.php" method="post" enctype="multipart/form-data"><label>select file: </label>
<div><?php echo $filewidget->render(); ?>
<?php echo $filewidget->renderprogressbar(); ?></div>
</form>

上一篇:IBM 谷歌等巨头联手支持Open Ajax计划
下一篇:AJAX技术 vs 传统的ASP无刷新技术