multiupload.html 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" >
  3. <head>
  4. <meta name="robots" content="noindex, nofollow" />
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>MultiUpload Demo</title>
  7. <link href="multiupload.css" rel="stylesheet" type="text/css" />
  8. <script type="text/javascript" src="../../jquery/jquery-1.4.2.min.js"></script>
  9. <script type="text/javascript" src="swfupload/swfupload.js"></script>
  10. <script type="text/javascript" src="multiupload.js"></script>
  11. <script type="text/javascript">
  12. $(window).load(pageInit);
  13. function pageInit()
  14. {
  15. var uploadurl='../upload.php',ext='所有文件 (*.*)',size='2 MB',count=5,useget=0,params={}//默认值
  16. uploadurl=getQuery('uploadurl')||uploadurl;ext=getQuery('ext')||ext;size=getQuery('size')||size;count=getQuery('count')||count;useget=getQuery('useget')||useget;
  17. var tmpParams=getQuery('params');
  18. if(tmpParams)
  19. {
  20. try{eval("tmpParams=" + tmpParams);}catch(ex){};
  21. params=$.extend({},params,tmpParams);
  22. }
  23. ext=ext.match(/([^\(]+?)\s*\(\s*([^\)]+?)\s*\)/i);
  24. setTimeout(fixHeight,10);
  25. swfu = new SWFUpload({
  26. // Flash组件
  27. flash_url : "swfupload/swfupload.swf",
  28. prevent_swf_caching : false,//是否缓存SWF文件
  29. // 服务器端
  30. upload_url: uploadurl,
  31. file_post_name : "filedata",
  32. post_params: params,//随文件上传一同向上传接收程序提交的Post数据
  33. use_query_string : useget=='1'?true:false,//是否用GET方式发送参数
  34. // 文件设置
  35. file_types : ext[2],//文件格式限制
  36. file_types_description : ext[1],//文件格式描述
  37. file_size_limit : size, // 文件大小限制
  38. file_upload_limit : count,//上传文件总数
  39. file_queue_limit:0,//上传队列总数
  40. custom_settings : {
  41. test : "aaa"
  42. },
  43. // 事件处理
  44. file_queued_handler : fileQueued,//添加成功
  45. file_queue_error_handler : fileQueueError,//添加失败
  46. upload_start_handler : uploadStart,//上传开始
  47. upload_progress_handler : uploadProgress,//上传进度
  48. upload_error_handler : uploadError,//上传失败
  49. upload_success_handler : uploadSuccess,//上传成功
  50. upload_complete_handler : uploadComplete,//上传结束
  51. // 按钮设置
  52. button_placeholder_id : "divAddFiles",
  53. button_width: 69,
  54. button_height: 17,
  55. button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
  56. button_cursor: SWFUpload.CURSOR.HAND,
  57. button_image_url : "img/add.gif",
  58. button_text: '<span class="theFont">添加文件</span>',
  59. button_text_style: ".theFont { font-size: 12px; }",
  60. button_text_left_padding: 20,
  61. button_text_top_padding: 0,
  62. // 调试设置
  63. debug: false
  64. });
  65. }
  66. function fixHeight(){$('#listArea').css('height',(document.body.clientHeight-56)+'px');}
  67. function getQuery(item){var svalue = location.search.match(new RegExp('[\?\&]' + item + '=([^\&]*)(\&?)','i'));return svalue?decodeURIComponent(svalue[1]):'';}
  68. //----------------跨域支持代码开始(非跨域环境请删除这段代码)----------------
  69. var JSON = JSON || {};
  70. JSON.stringify = JSON.stringify || function (obj) {
  71. var t = typeof (obj);
  72. if (t != "object" || obj === null) {
  73. if (t == "string")obj = '"'+obj+'"';
  74. return String(obj);
  75. }
  76. else {
  77. var n, v, json = [], arr = (obj && obj.constructor == Array);
  78. for (n in obj) {
  79. v = obj[n]; t = typeof(v);
  80. if (t == "string") v = '"'+v+'"';
  81. else if (t == "object" && v !== null) v = JSON.stringify(v);
  82. json.push((arr ? "" : '"' + n + '":') + String(v));
  83. }
  84. return (arr ? "[" : "{") + String(json) + (arr ? "]" : "}");
  85. }
  86. };
  87. var callback= callback || function(v){
  88. v=JSON.stringify(v);
  89. window.name=escape(v);
  90. window.location='http://'+location.search.match(/[\?&]editorhost=(.*)(&|$)/i)[1]+'/xheditorproxy.html';//这个文件最好是一个0字节文件,如果无此文件也会正常工作
  91. }
  92. //----------------跨域支持代码结束----------------
  93. </script>
  94. </head>
  95. <body>
  96. <div id="upload">
  97. <div id="buttonArea">
  98. <div id="controlBtns" style="display:none;"><a href="javascript:void(0);" id="btnClear" onclick="removeFile();" class="btn" style="display:none;"><span><img src="img/clear.gif" /> 删除文件</span></a> <a href="javascript:void(0);" id="btnStart" onclick="startUploadFiles();" class="btn"><span><img src="img/start.gif" /> 开始上传</span></a></div>
  99. <a href="javascript:void(0);" id="addFiles" class="btn"><span><div id="divAddFiles">添加文件</div></span></a>
  100. </div>
  101. <div id="listArea">
  102. <table width="100%" border="0" cellpadding="0" cellspacing="0">
  103. <thead id="listTitle"><tr><td width="53%">文件名</td><td width="25%">大小</td><td width="22%">状态</td></tr></thead>
  104. <tbody id="listBody">
  105. </tbody>
  106. </table>
  107. </div>
  108. <div id="progressArea">
  109. <div id="progressBar"><span>0%</span><div id="progress" style="width:1px;"></div></div>
  110. </div>
  111. </div>
  112. </body>
  113. </html>