SWFUpload多文件上传手册

上传人:平*** 文档编号:12276309 上传时间:2017-10-17 格式:DOC 页数:19 大小:113.92KB
返回 下载 相关 举报
SWFUpload多文件上传手册_第1页
第1页 / 共19页
SWFUpload多文件上传手册_第2页
第2页 / 共19页
SWFUpload多文件上传手册_第3页
第3页 / 共19页
SWFUpload多文件上传手册_第4页
第4页 / 共19页
SWFUpload多文件上传手册_第5页
第5页 / 共19页
点击查看更多>>
资源描述

《SWFUpload多文件上传手册》由会员分享,可在线阅读,更多相关《SWFUpload多文件上传手册(19页珍藏版)》请在金锄头文库上搜索。

1、SWFUpload中文文档地址是:http:/www.v- DEMO为:http:/demo.swfupload.org/v220/index.htm下载地址:http:/ Vinterwebb.se开发的一个客户端的上传工具. 它结合了FLASH和 JavaScript的功能,以提供一种超越了传统的浏览器中标签提供的文件上传功能。SWFUpload提供的主要功能: 在文件选择对话框中能够进行文件多选 页面无刷新的上传 提供上传进度的事件回调,实时显示上传进度 良好的浏览器兼容性 采用了命名空间以兼容其它 JS的库 (例如 jQuery, Prototype, 等等) 对 FLASH 9和 F

2、LASH 10播放器的支持(V2.2.0 版本放弃了对 Flash 8的支持) SWFUpload背后的设计思想和其它基于 Flash的上传工具是不同的。它将浏览器的中 UI交给开发人员来控制。开发人员能够利用 XHTML,CSS,Javascript来定制符合他们网站风格的 UI上传元素。然后使用它提供的一组简单的 JS事件来更新上传状态,开发人员能够利用这些事件来及时更新页面中的上传进度UI。不幸的是 Flash Player 10 更严格的安全机制迫使我们不得不将一个 Flash Button放入 Flash影片中。SWFUpload 提供 API供开发者通过图片、文字、CSS的方式来自

3、定制更灵活的 UI显示。SWFUpload v2SWFUpload v2包含了新的高级功能,改善了稳定性,解决了 FlashPlayer中的一些 bug,并且提供一套有用的插件。新的功能包括: 兼容了 Flash Player 10的安全限制问题 在文件上传的同时能够发送额外的 POST数据 针对每一个文件上传发送 POST/GET数据 更直观的事件回调 动态修改实例设置 接收服务端返回的数据 非取消形式的停止文件上传 自定义上传的顺序 支持单文件、多文件的文件的选择 文件入队数量,文件上传数量和文件大小的限制 更合理地处理 0字节的文件 针对每个文件在上传前都提供一个最后确认的时间回调 解决

4、了 v1.0.2版本中未描述到的关于 Flash的 bug 解决的 v1.0.2中的 bug: o 在 IE中,刷新的时候 FLASH无法加载 (详细可见我之前的 debug过程 ) o 在 FireFox中,如果窗口的滚动条没有回滚到顶部,那么 Flash无法加载 o Race-conditions when files are cached 兼容 ASP.Net Forms SWFUpload v2 延续了 SWFUpload的设计目标,将 UI分离以交给开发人员控制和后续扩展概述传统的 HTML上传标准的 HTML上传表单为用户提供一个文本框和按钮来选择文件,选中的文件是随着 form表

5、单提交的。整个文件上传完成之后,下一个页面才会显示,并且不能对选择的文件做预设的文件检验,例如文件大小限制,文件类型限制。当文件上传时,用户获得的可用的反馈信息很少。传统的 HTML上传模式十分简单,线性的,几乎所有浏览器都支持它。SWFUploadSWFUpload使用一个 Flash影片来控制文件的选择和上传。此 FLASH中包含一个用户自定制 UI的按钮,点击该按钮能够激活 Flash本身的高级文件上传对话框,它能够根据用户的设置来进行单文件或者是多文件的上传。 选择的的文件类型也是可以被限制的,因此用户只能选择指定的适当的文件,例如*.jgp;*.gif。提醒:Flash Player

6、 10 的安全机制更严格,类似打开文件上传的对话框的操作,一定需要用户交互才触发,如果用脚本触发,会报#2176 的运行时错误。因此 V2.2.0版本在 SWF中添加了一个可定制的 Button让用户交互来打开文件对话框。当选定文件以后,每个文件都会被验证和处理。当 Flash上传文件的时候,由开发人员预定义的 Javascript事件会被定时触发以便来更新页面中的 UI,同时还提供上传状态和错误信息。选定的文件的上传和它所在页面、表单是独立的。每个文件都是单独上传的,这就保证了服务端脚本能够在一个时间点更容易地处理单个文件。虽然 Flash提供了上传服务,但是页面并不会提交或者重新载入。相比

7、于标准的 HTML Form,SWFUpload 的使用方式更像是 AJAX程序,页面中的 Form会和 FLASH控制的文件上传单独处理。入门SWFUpload并不是拖放式的上传控件,它需要 JavaScript和 DOM的知识。一些可用的演示展示了它能够完成什么事情以及它是如何完成这些常见的任务。SWFUpload由 4部分组成:1. 初始化和设置(Javascript) 2. JavaScript 库: SWFUpload.js 3. SWFUpload.swf(V2.2.0版本放弃了对 flash 8的支持) 4. 事件处理(Javascript) 使用 SWFUpload遇到的多数问

8、题是由不正确地设置或者定义了糟糕的处理事件引起的。初始化和设置SWFpload必须在页面中初始化,一般可以在 window.onload事件中完成此操作。它的构造函数需要一个 Object类型的设置对象。 这个设置对象一般是一个直接定义的 Object类型变量,直接传递给 SWFUpload的构造函数。初始化的 SWFUpload对象的引用需要保留下来,因为当显示文件选择对话框和启动文件上传的时候需要这个实例的引用。例如:用直接定义的 Object类型变量设置初始化 SWFUpload对象var swfu; window.onload = function () swfu = new SWFU

9、pload( upload_url : http:/www.swfupload.org/upload.php, flash_url : http:/www.swfupload.org/swfupload.swf, button_placeholder_id : spanSWFUploadButton, file_size_limit : 20480 ); ; 例如:用存储在变量中的设置对象初始化 SWFUpload对象var swfu; window.onload = function () var settings_object = upload_url : http:/www.swfupl

10、oad.org/upload.php, flash_url : http:/www.swfupload.org/swfupload.swf, button_placeholder_id : spanSWFUploadButton, file_size_limit : 20480 ; swfu = new SWFUpload(settings_object); ; JavaScript 库该 JavaScript库文件(swfupload.js)应该包含在需要上传功能的页面中。当 SWFUpload创建完成并能访问它的一系列功能时,开发人员可以来控制此实例。例如: 添加 SWFUpload.js

11、到页面中例如: 根据需要的设置来初始化 SWFUploadvar swfu = new SWFUpload( upload_url : http:/www.swfupload.org/upload.php, flash_url : http:/www.swfupload.org/swfupload.swf, button_placeholder_id : spanSWFUploadButton ); Flash 控制元素SWFUpload JavaScript库动态加载 Flash控制元素(swfupload.swf)。Flash控制元素的文件地址在初始化的时候就应该在 SWFUpload设置

12、对象中定义。Flash控制元素是一个很小的的 Flash影片,它提供了文件浏览、检验和上传功能。它在页面中展现给用户的是一个 UI可自定制的按钮,但该 Flash会在需要时候通过与 Javascript通信来通知浏览器处理更新。事件处理开发人员必须定义一系列 JavaScript函数来处理 SWFUpload事件回调,当一些不同的重要事件发生的时候,这些函数会被触发。通过处理 SWFUpload的事件,开发人员能够提供关于上传进度、出错信息以及上传完成等的信息反馈。例如: swfupload 的处理事件和初始化/ uploadStart处理事件。该函数变量在设置对象中指定给了upload_st

13、art_handler属性。 var uploadStartEventHandler = function (file) var continue_with_upload; if (file.name = the sky is blue) continue_with_upload = true; else continue_with_upload = false; return continue_with_upload; ; /uploadSuccess处理事件。 该函数变量在设置对象中指定给了 upload_success_handler属性。 var uploadSuccessEventH

14、andler = function (file, server_data) alert(The file + file.name + has been delivered to the server.); alert(The server responded with + server_data); ; /创建SWFUpload实例,设置事件回调函数 var swfu = new SWFUpload( upload_url : http:/www.swfupload.org/upload.php, flash_url : http:/www.swfupload.org/swfupload.sw

15、f, file_size_limit : 20480, upload_start_handler : uploadStartEventHandler, upload_success_handler : uploadSuccessEventHandler ); SWFUpload JavaScript 对象构造函数SWFUpload(settings object)返回:一个 SWFUpload 实例var swfupload_instance = new SWFUpload(settings_object); 全局变量和常量SWFUpload定义了一些全局变量和常量,这对 SWFUpload的高级应用程序和处理错误都是很有用的,它们都是只读的。SWFUpload.instancesSWFUpload.instances是一个存储了页面中所有 SWFUpload实例引用的数组。Flash播放器依靠这个数组来调用正确的处理事件。该数组是由 movieName属性来索引的关联数组。例如:SWFUpload.instances.SWFUpload_0 访问的是第一个实例引用。注意 : SWFUpload.instances不是一个真正的 JavaScript数组,实际上它是一个对象(关联数组)。SWFUploa

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 办公文档 > 其它办公文档

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号