推荐这个博客:http://blog.csdn.net/hi_kevin/article/details/23430345

这个文章很不错,我推荐这个文章:http://leeon.me/upload/other/swfupload.html#globals

 var swfu;
window.onload = function () {
var settings = {
flash_url: "/plugins/swfupload/core/Flash/swfupload.swf",
upload_url: "/system/upload/annex",
post_params: {"PHPSESSID": sessionId, "name": "annex"},
file_size_limit: "30 MB",
file_types: "*.gif;*.jpg;*.jepg;*.png;*.bmp;*.txt;*.zip;*.rar;*.pdf;*.ppt;*.doc;*.xls;*.xlsx;*.docx;*.rtf",
file_types_description: "jap,png,rar,zip",
file_upload_limit: 0,
file_queue_limit: 0,
custom_settings: {
progressTarget: "fsUploadProgress",
cancelButtonId: "btnCancel"
},
debug: false, // Button settings
button_width: "80",
button_height: "20",
button_placeholder_id: "spanButtonPlaceHolder",
button_text: '上传附件',
button_text_left_padding: 12,
button_text_top_padding: 3, // The event handler functions are defined in handlers.js
file_queue_error_handler: fileQueueError,
file_dialog_complete_handler: replyFileDialogComplete,//当选择文件对话框关闭,并且所有选择文件已经处理完成(加入上传队列成功或者失败)时,此事件被触发
upload_error_handler: uploadError,
upload_success_handler: replyUploadSuccess,//当文件上传的处理已经完成
upload_start_handler: uploadStart,
file_queued_handler: fileQueued,// 文件被加入队列时触发 upload_progress_handler: uploadProgress //进度
// upload_start_handler: upload_start_handlers //在文件往服务端上传之前触发此事件,可以在这里完成上传前的最后验证以及其他你需要的操作
// upload_progress_handler : uploadProgress,
};
swfu = new SWFUpload(settings);
}; function fileQueued(file) {
var swfUpload = this;
var listItem = '<li id="' + file.id + '">';
listItem += '文件:<em>' + file.name + '</em>(' + Math.round(file.size/1024) + ' KB)';
listItem += '<span class="progressValue"></span>'
+ '<div class="progressBar"><div class="progress"></div></div>'
+ '<p class="status" >Pending</p>'
+ '<span class="cancel" > </span>'
+ '</li>';
$("#logList").append(listItem);
// $("li#" + file.id + " .cancel").click(function(e) {
// swfUpload.cancelUpload(file.id);
// $("li#" + file.id).slideUp('fast');
// })
// swfUpload.startUpload();
} function uploadStart(file) {
if (file) {
$("#logList li#" + file.id).find('p.status').text('上传中...');
$("#logList li#" + file.id).find('p.progressValue').text('0%');
}
}
/**
* 文件上传过程中定时触发,更新进度显示
* @param file 上传的文件
* @param bytesCompleted 已上传大小
* @param bytesTotal 文件总大小
*/
function uploadProgress(file,bytesCompleted,bytesTotal) {
var percentage = Math.round((bytesCompleted / bytesTotal) * 100);
$("#logList li#" + file.id).find('div.progress').css('width',percentage + '%');
$("#logList li#" + file.id).find('span.progressValue').text(percentage + '%');
} //上传成功动作
function replyUploadSuccess(file, serverData) {
try { var data = JSON.parse(serverData);
var size = $("div .btn-group").attr("data-size");
layer.msg("附件(" + file.name + ")上传成功", 1, {type: 1}, function () {
//显示附件信息
var html = '<div class="btn-group" data-size="0" style="margin-left: 70px;" id="' + data.fileId + '"><input type="checkbox" class="annex"' +
' style="float:left;" checked name="annex[' + data.fileId + ']" value="' + file.name + '" ><div name="filename" style="float:left;" >' + file.name + '</div>' +
'<a style="margin-left:20px;cursor:pointer;float:left; " onclick="delAnnex(this)" >删除</a></div> '; var item = $("#logList li#" + file.id);
item.find('div.progress').css('width','100%');
item.find('span.progressValue').css('color','red').text('100%');
item.addClass('success').find('p.status').html('上传完成!'); if(size==null ||size=='undefied'){
$("#showAnnex").append(html);
$("div .btn-group").attr("data-size", file.size);
}else{
var total_size = size * 1 + file.size * 1;
$("div .btn-group").attr("data-size", total_size);
var max_size = $("div .btn-group").attr("data-size");
if(max_size>=52428800){
alert("附件总大小不超过 50M"); return ;
}else{
$("#showAnnex").append(html);
}
}
//绑定文件删除事件
$(".annex").change(function () {
if (!$(this).is(':checked')) {
$(this).parent().remove();
}
//TODO 检查是否显示上传框
});
});
} catch (ex) {
this.debug(ex);
alert(ex);
}
} //上传文件
function replyFileDialogComplete(numFilesSelected, numFilesQueued) {
try {
this.startUpload();
} catch (ex) {
this.debug(ex);
}
} //删除附件操作
function delAnnex(obj) {
var annex = obj.parentNode.firstChild.value;
$.ajax({
type: "get",
url: "/email/draft/del-annex?annex=" + annex,
dataType: "json",
success: function (data) {
if (data.status == 'y') {
obj.parentNode.remove();
layer.msg(data.info, 1, 9);
$_this.parent().parent().remove();
} else {
layer.alert(data.info);
}
}
});
}

swf 上传的更多相关文章

  1. swf上传文件

    以下是自学it网--中级班上课笔记 网址:www.zixue.it 引入的js包自己在网上找一个,这里好像不支持上传文件,反正我没找到,呵呵~~ html文件 <!DOCTYPE html PU ...

  2. swf上传

    swfupload多文件异步上传 多文件选择异步上传的原理 传统上:多个文件逐一选.PHP开始处理,循环上 PHP+Flash上:JS调用flash控,Flash批量选取并保持选取所有文件列 swfu ...

  3. jquery.uploadify文件上传组件

    1.jquery.uploadify简介 在ASP.NET中上传的控件有很多,比如.NET自带的FileUpload,以及SWFUpload,Uploadify等等,尤其后面两个控件的用户体验比较好, ...

  4. jquery文件上传控件 Uploadify 问题记录

    Uploadify v3.2.1 首先引用下面的文件 <!--上传控件 uploadify--> <script type="text/javascript" s ...

  5. PHP上传大文件 分割文件上传

    最近遇到这么个情况,需要将一些大的文件上传到服务器,我现在拥有的权限是只能在一个网页版的文件管理系统来进行操作,可以解压,可以压缩,当然也可以用它来在线编辑.php文件. 文件有40M左右,但是服务器 ...

  6. JQuery文件上传插件uploadify在MVC中Session丢失的解决方案

    <script type="text/javascript"> var auth = "@(Request.Cookies[FormsAuthenticati ...

  7. jsp+servlet+jquery 用jquery uploadify最新版本实现多文件上传

    //这是script代码 <link rel="stylesheet" type="text/css" href="uploadify/uplo ...

  8. ASP.NET Jquery+ajax上传文件(带进度条)

    效果图 支持ie6+,chrome,ie6中文文件名会显示乱码. 上传时候会显示进度条. 需要jquery.uploadify.js插件,稍后会给出下载 前台代码 <%@ Page Langua ...

  9. Springmvc+uploadify实现文件带进度条批量上传

    网上看了很多关于文件上传的帖子,众口不一,感觉有点乱,最近正好公司的项目里用到JQuery的uploadify控件做文件上传,所以整理下头绪,搞篇文档出来,供亲们分享. Uploadify控件的主要优 ...

随机推荐

  1. Ubuntu18.04安装Android Studio

    一.安装JDK JDK下载地址:https://www.oracle.com/technetwork/java/javase/downloads/jdk11-downloads-5066655.htm ...

  2. Unity3D学习笔记(二十九):AssetBundle

    AssetBundle 什么是AssetBundle? AssetBundle是把一些资源文件或场景文件,以某种方式保存在一个文件中.一个AssetBundle可以包含模型.材质.图片或场景等.但是A ...

  3. POJ 2718 Smallest Difference(最小差)

     Smallest Difference(最小差) Time Limit: 1000MS    Memory Limit: 65536K Description - 题目描述 Given a numb ...

  4. Shell 脚本批量创建数据库表

    使用 Shell 脚本批量创建数据表 系统:Centos6.5 64位 MySQL版本:5.1.73 比如下面这个脚本: #!/bin/bash #批量新建数据表 for y in {0..199}; ...

  5. _itemmod_unbind

    该表中的物品可以用一定代价进行解绑,解绑后可以移动,但下线将会导致物品重新绑定 `entry`物品entry `reqId` 解绑消耗模板Id `备注` 备注

  6. Qt Model/View学习(二)

    Model和View的搭配使用 DEMO pro文件 #------------------------------------------------- # # Project created by ...

  7. ace后台管理系统扁平化框架

    Bootstrap ACE后台管理界面模板(扁平化) 所属分类:后台模板 文件大小:1.22 MB 阅读:236697次 下载:55929次 来源:www.daimajiayuan.com 分享到:更 ...

  8. h5内容超出可以滑动展示的处理,iscroll的使用

    第一步: 引入js 第二步:页面结构 第三步:使用 dome效果:http://cubiq.org/dropbox/iscroll4/examples/simple/ 文档地址:http://iscr ...

  9. 在远程连接一个 Wndows 10的情况下,重启远程机器

    如果你从菜单找的话,是找不到这个菜单的!!! 你应该直接按 alt + F4 , 就会出现这个选项了. 参考: https://tommynation.com/shut-windows-10-remo ...

  10. Python 编程快速上手 第十一章 Web scrapping

    前言 这一章讲了如何在 Web 上抓取相关的信息,工具是三个模块: webbrowser 模块:用于打开浏览器指定页面 requests 模块:用于下载文件 Beautiful Soup 模块:用于解 ...