多选图片一次上传(as+js) ,仿QQ相册

 

做上传图片功能的时候，经常会遇到这样一个问题，有时候可能需要一次上传多张图片，而用html中默认的上控件，却只能选定一个文件，且不能对文件的后缀进行筛选。需要一次上传多个文件的需求，往往可以通过添加多个上传控件来予以满足，比如百度空间的相册上传功能就是这样来实现的。不过，要实现对上传文件后缀的过滤，却始终无法通过常规的方法予以实现。
这两个功能真的这么难以实现吗？非也，看看flickr的上传功能即可获得明确的答复。
为什么能实现这样的功能呢？google了一下，谜底就揭晓了。原来，这是利用了flash的若干功能，通过javascript和 actionscript的交互得以实现的。js和as的通讯以前有研究过，所以要实现起来非常简单。再到flash里边f1一下，关于上传方面的相关只是也差不多了解了，因此，接下来的事情的就只是顺水推舟的事情了。
最重要的还是flash代码的完善，最后的成果如下：

Java代码

1. // MultiUploader.fla   
2. import flash.net.FileReferenceList;   
3. import flash.net.FileReference;   
4. import flash.external.ExternalInterface;   
5.   
6. // 设置as中函数和js调用时的映射关系   
7. ExternalInterface.addCallback("fu_open_dialog", null, openDialog);   
8. ExternalInterface.addCallback("fu_begin_upload", null, beginUpload);   
9.   
10. // 可以通过html页面里边设置FlashVars里边的upload_url来更改上传文件的路径   
11. var uploadUrl:String = typeof(_root.upload_url) == "undefined" ? "FlashUpload.ashx" : _root.upload_url;   
12. var listener:Object = new Object();   
13. // 选择文件后，会视图调用js函数onUploaderSelect，并将文件列表传入进去，便于js进一步做一些逻辑控制   
14. listener.onSelect = function(fileRefList:FileReferenceList) {   
15.     ExternalInterface.call("onUploaderSelect", fileRefList.fileList);    
16. };   
17.   
18. var fileRefList:FileReferenceList = null;   
19. var imageTypes:Object = new Object();   
20. imageTypes.description = "Images (*.jpg, *.jpeg, *.gif, *.png)"; // 上传文件类型说明   
21. imageTypes.extension = "*.jpg; *.jpeg; *.gif; *.png"; // 控制上传文件类型   
22.   
23. // 显示文件打开窗口   
24. function openDialog():Void {   
25.     if (fileRefList == null) {