Uploadify是一款功能强大，高度可定制的文件上传插件，实现的效果非常不错，带进度显示。在最简单的方式下，Uploadify使用很少的代码就可以运行起来。 Uploadify官方下载地址：http://www.uploadify.com/download/
测试例子
以下是一个使用的简单例子： 这里我们采用了Uploadify包中自带的PHP测试脚本作为上传的处理，所以这里安装了wamp作为PHP的测试环境，在PHP的网站根目录中，解压上面下载好的Uploadify文件，并创建一个文件上传保存的目录，这里我们在Uploadify的解压目录中创建到了uploads作为文件保存目录。创建uploadify_test.PHP文件，添加如下内容：
<style type="text/css">
custom-demo .uploadifyQueueItem {
background-color: #FFFFFF;
border: none;
border-bottom: 1px solid #E5E5E5;
font: 11px Verdana,Geneva,sans-serif;
height: 50px;
margin-top: 0;
padding: 10px;
width: 350px;
}
#custom-demo .uploadifyError {
background-color: #FDE5DD !important;
border: none !important;
border-bottom: 1px solid #FBCBBC !important;
}
#custom-demo .uploadifyQueueItem .cancel {
float: right;
}
#custom-demo .uploadifyQueue .completed {
color: #C5C5C5;
}
#custom-demo .uploadifyProgress {
background-color: #E5E5E5;
margin-top: 10px;
width: 100%;
}
#custom-demo .uploadifyProgressBar {
background-color: #0099FF;
height: 3px;
width: 1px;
}
#custom-demo #custom-queue {
border: 1px solid #E5E5E5;
height: 213px;
margin-bottom: 10px;
width: 370px;
} <script type="text/javascript">
$(function() {
$('#custom_file_upload').uploadify({
'uploader' : 'uploadify-v2.1.4/uploadify.swf','script' : 'uploadify-v2.1.4/uploadify.PHP','cancelImg' : 'uploadify-v2.1.4/cancel.png','folder' : 'uploadify-v2.1.4/uploads','multi' : true,'auto' : true,'fileExt' : '.jpg;.gif;.png;.txt','fileDesc' : 'Image Files (.JPG,.GIF,.PNG)','queueID' : 'custom-queue','queueSizeLimit' : 3,'simUploadLimit' : 3,'sizeLimit' : 1024000,'removeCompleted': false,'onSelectOnce' : function(event,data) {
$('#status-message').text(data.filesSelected + ' files have been added to the queue.');
},'onAllComplete' : function(event,data) {
$('#status-message').text(data.filesUploaded + ' files uploaded,' + data.errors + ' errors.');
}
});
});
<h2>Custom Demo</h2>
<p>Uploadify is fully customizable. Here is an implementation with multiple files,auto uploads,limited file types,limited queue size,and custom onSelectOnce and onAllComplete functions.</p>
<div class="demo-<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>">
<div id="status-message">Select some files to upload:</div>
<div id="custom-queue"></div>
<input id="custom_file_upload" type="file" name="Filedata" />
</div>