SWFUpload:
http://www.swfupload.org/forum/news/550
SWFUpload是一个客户端文件上传工具,最初由Vinterwebb.se开发,它通过整合Flash与JavaScript技术为WEB开发者提供了一个具有丰富功能继而超越传统标签的文件上传模式。
SWFUpload的主要特点
* 可以同时上传多个文件;
* 类似AJAX的无刷新上传;
* 可以显示上传进度;
* 良好的浏览器兼容性;
* 兼容其他JavaScript库 (例如:jQuery, Prototype等);
* 支持Flash 8和Flash 9;
SWFUpload不同于其他基于Flash构建的上传工具,它有着优雅的代码设计,开发者可以利用XHTML、CSS和JavaScript来随心所欲的定制它在浏览器下的外观;它还提供了一组简明的JavaScript事件,借助它们开发者可以方便的在文件上传过程中更新页面内容来营造各种动态效果。
现在SWFUpload为2.0.2版本,经过本人汉化及修改,能够在php中正确的运行,现把功能和使用说明一下:
1、本版本只能上传单个文件;
2、能够上传文件到指定文件夹;
3、在upload.php中可以加入数据库代码,把文件的保存路径放在数据库中;
4、在upload.php中必需有一个返回值到index.php表单的hidFileID中,不然相当于没有把文件上传,返回值用echo来输出;
5、从upload.php中echo过来的值放在index.php表单的hidFileID中,并POST到think.php中并显示。
=============================================================================
SWFUpload实质上是一个 flash 程序,利用 flash 提供的多文件上传功能来上传文件。
所以在客户端(也就是页面中),只需要嵌入这个 flash 就行了。而服务端,按照 PHP 处理上传文件的做法处理即可。要注意的是,虽然可以上传多个文件,但实质上是一次传一个,所以在服务端每次处理一个文件的上传就可以了。
具体代码如下。客户端:
<script language="javascript" type="text/javascript" src="/scripts/jquery.js"></script>
<script language="javascript" type="text/javascript" src="/scripts/mmSWFUpload.js"></script>
<script language="javascript" type="text/javascript">
var uploadQueue: {files: new Array(), totalSize: 0, completed: 0};
// 上传文件开始
uploadStart: function(fileObj) {
var e = $("#uploadFileListing");
if (uploadQueue.totalSize == 0) {
$('#uploadingFilename').text('').show();
$('#uploadingProgressBar').width(0).show();
$('#selectUploadFiles').attr('disabled', true);
}
uploadQueue.totalSize += fileObj.size;
}
// 上传中
uploadProgress: function(fileObj, bytesLoaded) {
completed = uploadQueue.completed + bytesLoaded;
percent = Math.ceil((completed / uploadQueue.totalSize) * 100);
$('#uploadingProgressBar').css('width', percent + '%');
$('#uploadingFilename').text(fileObj.name);
}
// 上传完成
uploadComplete: function(fileObj) {
uploadQueue.completed += fileObj.size;
}
// 上传队列完成
uploadQueueComplete: function() {
uploadQueue.completed = 0;
uploadQueue.totalSize = 0;
uploadQueue.files = new Array();
$('#uploadingProgressBar').fadeOut('slow');
$('#uploadingFilename').fadeOut('slow');
$('#selectUploadFiles').attr('disabled', false);
// 上传完成后跳转到其他页面
document.location.href = ".........."
}
$(function() {
// 初始化上传插件
mmSWFUpload.init({
upload_backend: encodeURIComponent("{{ url controller='BoProducts' action='upload' product_id=$product_id }}"),
target: "SWFUpload",
swf_path: "/scripts/upload.swf",
allowed_filetypes: "*.gif;*.jpg;*.png;*.jpeg",
allowed_filesize: 2000,
upload_start_callback: 'uploadStart',
upload_progress_callback: 'uploadProgress',
upload_complete_callback: 'uploadComplete',
upload_queue_complete_callback: 'uploadQueueComplete',
upload_error_callback: 'uploadError'
});
$('#selectUploadFiles').click(function () { mmSWFUpload.callSWF(); });
});
</script>
<!-- 用于插入 flash 脚本 // -->
<div id="SWFUpload" style="width: 0px; height: 0px;"></div></td>
<!-- 用于显示上传文件名 // -->
<span id="uploadingFilename"></span>
<!-- 用于显示上传进度条 // -->
<div id="uploadingProgressBar"></div>
<!-- 上传按钮,点击选择上传文件 // -->
<input type="button" id="selectUploadFiles" value="上传" />



