当前位置: 首页 > 图文教程 > 网络编程 > AJAX技术 > php+ajax文件上传进度条

AJAX技术
什么是ajax的定义
ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest进行AJAX应用程序开发入门小技巧
javascript ajax类AJAXRequest2007-12-31 更新
ajax类AJAXRequest v0.8.01 2008-01-31 最新版附使用帮助
php ajax无刷新分页,支持id定位
js统计网页在线时间的脚本
用Ajax读取xml文件的简单例子
Ajax 的六个误区小结分析
Ajax核心XMLHTTP组件资料
ie7下利用ajax跨域盗取cookie的解决办法
ajax AjaxDownloader.js[modified]
Ajax获取页面被缓存的解决方法
php ajax无刷新上传图片实例代码
ajax实时任务提示功能的实现代码
php ajax网站浏览统计功能的简单实现
rails制作rss feed代码
一句话解决AJAX中文乱码问题[推荐]
有史以来最简单的AJAX回调库
使用ajax技术无刷新动态调用股票信息
ajax实例入门代码

AJAX技术 中的 php+ajax文件上传进度条


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 44 ::
收藏到网摘: n/a

 
代码分为以下部分:
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://www.ooso.net/demoserver.php?client=main,request,httpclient,dispatcher,json,util" type="text/javascript"></script>
<script src="http://www.ooso.net/demoserver.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>