1. <script src="../js/swfupload/swfupload.js" type="text/javascript"></script>
  2.  
  3. <script src="../js/swfupload/swfupload.queue.js" type="text/javascript"></script>
  4.  
  5. <script src="../js/swfupload/fileprogress.js" type="text/javascript"></script>
  6.  
  7. <script src="swfMgr/handlers.js" type="text/javascript"></script>
  8.  
  9. <tr <%=tp_addList %> id="tp_addList">
  10. <td class="left_title_2" width="100px">
  11. 上传图片列表:
  12. </td>
  13. <td id="Td1">
  14. <%--上传多个图片--%>
  15. <div align="left">
  16. <input id="middleImg" /><span style="color: Red;">注明:图片以(655*500),单个文件最大5000KB;默认设置最后一张为首页图片,图片名不能重复,一张张按照顺序上传</span>
  17. <p id="fileQueue2" style="width: 320px; margin: 0 auto;">
  18. </p>
  19. <ul id="ulList">
  20. </ul>
  21. </div>
  22. </td>
  23. </tr>
  24.  
  25. <asp:HiddenField ID="hidStr" runat="server" Value="" />
  26. <asp:HiddenField ID="hidFolder" runat="server" Value="0" />
  27.  
  28. <script type="text/javascript">
  29. var tmpFolder = $("#hidFolder").val();
  30. var tmpNum = 0;
  31. var tmpTotal = 0;
  32.  
  33. function uploadSuccessOther(file, serverData) {
  34. try {
  35. var progress = new FileProgress(file, this.customSettings.upload_target);
  36. progress.setComplete();
  37. progress.setStatus("正在上传!");
  38. progress.toggleCancel(false);
  39. } catch (ex) {
  40. //alert(ex.message);
  41. }
  42. //成功后,处理
  43. $("#ulList").append('<li><table><tbody><tr><td><img width="100" src="../../img/' + tmpFolder + '/100/' + serverData + '"></td></tr><tr><td><label><input type="radio" class="setIndex" style="margin-right: 5px;" name="rdo" value="' + serverData + '">首页显示</label>&nbsp;<a style="color: Red;" href="javascript:;" class="delImg">删除</a></td></tr></tbody></table></li>');
  44. $("#info_tp_add").val(serverData); //隐藏图片路径
  45.  
  46. tmpTotal += 1;
  47. if (tmpNum == tmpTotal) {
  48. $(".ajaxloading").hide();
  49. window.onbeforeunload = function() { };
  50. $(".saveClass").removeAttr("disabled", "disabled");
  51. }
  52. }
  53.  
  54. function fileDialogCompleteOther(numFilesSelected, numFilesQueued) {
  55. try {
  56. tmpNum = parseInt(numFilesQueued);
  57. if (tmpNum > 0) {
  58. this.startUpload();
  59. $("#divLoading").css({ height: $(window).height() + 150 + tmpNum * 50 });
  60. $(".ajaxloading").css({ top: $(window).scrollTop() + 150 }).show();
  61. // $(".saveClass").attr("disabled", "disabled"); //在上传过程中将保持按钮禁用
  62.  
  63. // window.onbeforeunload = function() { return ("确认离开当前页面吗?未保存的数据将会丢失!"); }
  64. } else {
  65. }
  66. } catch (ex) {
  67. //this.debug(ex);
  68. }
  69. }
  70.  
  71. //
  72. var swfMiddle;
  73. window.onload = function() {
  74. swfMiddle = new SWFUpload({
  75. // Backend Settings
  76. upload_url: "swfMgr/Handler.ashx",
  77. post_params: {
  78. 'ASPSESSID': '<%=Session.SessionID %>',
  79. 'Folder': tmpFolder,
  80. 't': 'i'
  81. },
  82.  
  83. // File Upload Settings
  84. file_size_limit: "5000",
  85. file_types: "*.jpg;*.png",
  86. file_types_description: "JPG,PNG",
  87. file_upload_limit: 0, // Zero means unlimited
  88.  
  89. swfupload_preload_handler: preLoad,
  90. swfupload_load_failed_handler: loadFailed,
  91. file_queue_error_handler: fileQueueError, //队列错误
  92. file_dialog_complete_handler: fileDialogCompleteOther,
  93. upload_progress_handler: uploadProgress,
  94. upload_error_handler: uploadError,
  95. upload_success_handler: uploadSuccessOther,
  96. upload_complete_handler: uploadComplete,
  97.  
  98. // Button settings
  99. button_image_url: "../js/swfupload/buttons/XPButtonNoText_61x22.png",
  100. button_placeholder_id: "middleImg",
  101. button_width: 61,
  102. button_height: 22,
  103. button_text: '<span class="button">添加图片<span class="buttonSmall"></span></span>',
  104. button_text_style: '.button { font-family: Helvetica, Arial, sans-serif; font-size: 12px;font-weight:bold;} .buttonSmall { font-size: 12px; }',
  105. button_text_top_padding: 1,
  106. button_text_left_padding: 5,
  107.  
  108. button_cursor: SWFUpload.CURSOR.HAND,
  109. button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
  110.  
  111. // Flash Settings
  112. flash_url: "../js/swfupload/swfupload.swf", // Relative to this file
  113. flash9_url: "../js/swfupload/swfupload_FP9.swf", // Relative to this file
  114.  
  115. custom_settings: {
  116. upload_target: "fileQueue2"
  117. }
  118. //图片上传
  119. });
  120. }
  121.  
  122. </script>
  123.  
  124. <script type="text/javascript">
  125. $(function() {
  126.  
  127. //删除该上传图片
  128. $(document).delegate(".delImg", "click", function() {
  129. if ($(this).prev().find("input").attr("checked")) {
  130. alert('已经设置首页的图片无法删除!');
  131. return false;
  132. }
  133.  
  134. if (!confirm("确定要删除这张图片吗?")) return false;
  135. var tmpLi = $(this).parents("li").eq(0);
  136. $.post("swfMgr/fileMgr.ashx", {
  137. t: "del",
  138. f: $("#hidFolder").val(),
  139. n: $(this).prev().find("input").val()
  140. }, function(rdata) {
  141. if (rdata = "1") {
  142. tmpLi.remove();
  143. }
  144. });
  145. });
  146.  
  147. //首页显示
  148. $(document).delegate(".setIndex", "click", function() {
  149. var value = $(this).val();
  150. if (!confirm("确定要设置这张图片首页显示吗?")) return false;
  151. $("#info_tp_add").val(value); //确定保存后隐藏图片路径
  152. });
  153. });
  154. </script>

效果图:

swfupload多图上传插件(ASP.NET)的更多相关文章

  1. Vue的移动端多图上传插件vue-easy-uploader

    原文地址 前言 这段时间赶项目,需要用到多文件上传,用Vue进行前端项目开发.在网上找了不少插件,都不是十分满意,有的使用起来繁琐,有的不能适应本项目.就打算自己折腾一下,写一个Vue的上传插件,一劳 ...

  2. Bootstrap FileInput 多图上传插件 文档属性说明

    Bootstrap FileInput 多图上传插件   原文链接:http://blog.csdn.net/misterwho/article/details/72886248?utm_source ...

  3. yii2组件之多图上传插件FileInput的详细使用

    作者:白狼 出处:http://www.manks.top/yii2_multiply_images.html 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连 ...

  4. SWFUpload多图上传、C#后端跨域传文件带参数

    前几天工作中用到了SWFUpload上传图片,涉及到跨域,因为前端无法实现跨域,所以只能把文件传到后端进行跨域请求,整理分享下. 效果图 前端 html部分 <!DOCTYPE html> ...

  5. 帝国CMS7.2新增多图同时上传插件,上传多图效率更高

    原来上传多图文件,需要挨个选择文件,然后再点批量上传,比较麻烦.所以帝国CMS7.2新增了多图上传插件:为采用FLASH方式实现同时选择多个图片一起上传,提高多图上传效率. 帝国CMS多图上传插件特性 ...

  6. PHP之:多图上传

    撰写日期:2016-6-30 15:17:35 Thursday 参考 http://a3147972.blog.51cto.com/2366547/1381136 (08-05ThinkPHP+sw ...

  7. SWFUpload批量上传插件

    SWFUpload是一个批量上传插件,在HTML4.1里面,估计也只有Flash+javascript配合才能够做到了.先复制个重要的网址,这个应该是官方的文档了,相当齐全. http://leeon ...

  8. 封装Web Uploader 上传插件、My97DatePicker、百度 编辑器 的使用 (ASP.NET MVC)

    Web Uploader: WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主,FLASH为辅的现代文件上传组件.在现代的浏览器里面能充分发挥HTML5的优 ...

  9. ASP.NET MVC5+EF6+EasyUI 后台管理系统(32)-swfupload多文件上传[附源码]

    系列目录 文件上传这东西说到底有时候很痛,原来的asp.net服务器控件提供了很简单的上传,但是有回传,还没有进度条提示.这次我们演示利用swfupload多文件上传,项目上文件上传是比不可少的,大家 ...

随机推荐

  1. mfc---CFileDialog的过滤器

    CFileDialog的过滤器每种类型由两部分组成“tda|*.tda”,两种类型之间用“|”隔开

  2. PHP文本的读写

    <?php $txtPart="test0.txt"; //export $txtPartContent=fopen($txtPart,"r"); //读 ...

  3. Struts2中的配置文件的加载

    Struts2框架配置文件加载顺序(服务器启动之后, 这些配置文件会按照顺序一一加载进内存, 进行类等匹配的时候才会去内存查找):    1. default.properties    2. str ...

  4. 服务器 ADO 错误:0x80004005,[DBNETLIB]

    2012-12-0310:44:06 ]ADO 错误:0x80004005,[DBNETLIB][ConnectionOpen(Connect()).]SQL Server 不存在或拒绝访问.[ 20 ...

  5. .Net程序员学用Oracle系列(22):分析函数(OVER)

    1.函数语法 1.1.语法概述 1.2.窗口详解 1.2.1.ROWS 窗口 1.2.2.RANGE 窗口 2.函数用法 2.1.普通统计类函数 2.2.数据排序类函数 2.3.数据分布类函数 2.4 ...

  6. RabbitMQ-从基础到实战(3)— 消息的交换

    1.简介 在前面的例子中,每个消息都只对应一个消费者,即使有多个消费者在线,也只会有一个消费者接收并处理一条消息,这是消息中间件的一种常用方式.还有另外一种方式,生产者生产一条消息,广播给所有的消费者 ...

  7. JavaWeb从0开始学(二)-----JSP基本语法与编译指令

    在上一节中我们学习了如何搭建一个简单的Web应用,并且已经知晓了一个JSP页面主要由静态的HTML内容和动态的Java脚本共同组成.JSP的基本语法共有JSP注释.JSP声明.输出JSP表达式与JSP ...

  8. AOP执行增强-Spring 源码系列(5)

    AOP增强实现-Spring 源码系列(5) 目录: Ioc容器beanDefinition-Spring 源码(1) Ioc容器依赖注入-Spring 源码(2) Ioc容器BeanPostProc ...

  9. 通过Eclipse3.1以上启动Tomcat访问不到tomcat管理界面的问题(转载)

    通过Eclipse插件启动Tomcat的问题 默认分类   2009-10-23 15:54   阅读118   评论0   字号: 大  中  小 目前在通过Eclipse中插件启动Tomcat时遇 ...

  10. X64系统下IIS运行ASP网站HTTP500错误 【安装FoxMail Server时出现】

    错误如上 解决办法 使用管理员模式运行CMD 输入cscript C:\inetpub\adminscripts\adsutil.vbs SET W3SVC/AppPools/Enable32bitA ...