';
html += '
';
html += '
';
html += '
';
html += '
';
html += '
';
html += ' ';
html += '
';
html += '
';
html += '
';
html += '';
}
$(self).append(html).css({"width":para.width,"height":para.height});
// 初始化html之后绑定按钮的点击事件
this.addEvent();
};
/**
* 功能：显示统计信息和绑定继续上传和上传按钮的点击事件
* 参数: 无
* 返回: 无
*/
this.funSetStatusInfo = function(files){
var size = 0;
var num = files.length;
$.each(files, function(k,v){
// 计算得到文件总大小
size += v.size;
});
// 转化为kb和MB格式。文件的名字、大小、类型都是可以现实出来。
if (size > 1024 * 1024) {
size = (Math.round(size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
} else {
size = (Math.round(size * 100 / 1024) / 100).toString() + 'KB';
}
if(num >= 5){
$(".add_upload").hide();
}else{
$(".add_upload").show();
}
// 设置内容
$("#status_info").html("选中"+num+"张文件，共"+size+"。");
};
/**
* 功能：过滤上传的文件格式等
* 参数: files 本次选择的文件
* 返回: 通过的文件
*/
this.funFilterEligibleFile = function(files){
var arrFiles = []; // 替换的文件数组
for (var i = 0, file; file = files[i]; i++) {
if (file.size >= 51200000) {
alert('您这个"'+ file.name +'"文件大小过大');
} else {
// 在这里需要判断当前所有文件中
arrFiles.push(file);
}
}
return arrFiles;
};
/**
* 功能： 处理参数和格式上的预览html
* 参数: files 本次选择的文件
* 返回: 预览的html
*/
this.funDisposePreviewHtml = function(file, e){
var html = "";
var imgWidth = parseInt(para.itemWidth.replace("px", ""))-15;
// 处理配置参数删除按钮
var delHtml = "";
if(para.del){ // 显示删除按钮
delHtml = '
';
}
// 处理不同类型文件代表的图标
var fileImgSrc = "control/images/fileType/";
if(file.type.indexOf("rar") > 0){
fileImgSrc = fileImgSrc + "rar.png";
}else if(file.type.indexOf("zip") > 0){
fileImgSrc = fileImgSrc + "zip.png";
}else if(file.type.indexOf("text") > 0){
fileImgSrc = fileImgSrc + "txt.png";
}else{
fileImgSrc = fileImgSrc + "file.png";
}
// 图片上传的是图片还是其他类型文件
if (file.type.indexOf("image") == 0) {
html += '
';
}else{
html += '
';
}
return html;
};
/**
* 功能：调用核心插件
* 参数: 无
* 返回: 无
*/
this.createCorePlug = function(){
var params = {
fileInput: $("#fileImage").get(0),
uploadInput: $("#fileSubmit").get(0),
dragDrop: $("#fileDragArea").get(0),
url: $("#uploadForm").attr("action"),
filterFile: function(files) {
// 过滤合格的文件
return self.funFilterEligibleFile(files);
},
onSelect: function(selectFiles, allFiles) {
para.onSelect(selectFiles, allFiles); // 回调方法
self.funSetStatusInfo(ZYFILE.funReturnNeedFiles()); // 显示统计信息
var html = '', i = 0;
// 组织预览html
var funDealtPreviewHtml = function() {
file = selectFiles[i];
if (file) {
var reader = new FileReader()
reader.onload = function(e) {
// 处理下配置参数和格式的html
html += self.funDisposePreviewHtml(file, e);
i++;
// 再接着调用此方法递归组成可以预览的html
funDealtPreviewHtml();
}
reader.readAsDataURL(file);
} else {
// 走到这里说明文件html已经组织完毕，要把html添加到预览区
funAppendPreviewHtml(html);
}
};
// 添加预览html
var funAppendPreviewHtml = function(html){
// 添加到添加按钮前
if(para.dragDrop){
$("#preview").append(html);
}else{
$(".add_upload").before(html);
}
// 绑定删除按钮
funBindDelEvent();
};
// 绑定删除按钮事件
var funBindDelEvent = function(){
if($(".file_del").length>0){
// 删除方法
$(".file_del").click(function() {
ZYFILE.funDeleteFile(parseInt($(this).attr("data-index")), true);
return false;
});
}
if($(".file_edit").length>0){
// 编辑方法
$(".file_edit").click(function() {
// 调用编辑操作
//ZYFILE.funEditFile(parseInt($(this).attr("data-index")), true);
return false;
});
}
};
// // 绑定显示操作栏事件
// var funBindHoverEvent = function(){
// $(".upload_append_list").hover(
// function (e) {
// $(this).find(".file_bar").addClass("file_hover");
// },function (e) {
// $(this).find(".file_bar").removeClass("file_hover");
// }
// );
// };
funDealtPreviewHtml();
},
onDelete: function(file, files) {
// 移除效果
$("#uploadList_" + file.index).fadeOut();
// 重新设置统计栏信息
self.funSetStatusInfo(files);
console.info("剩下的文件");
console.info(files);
},
onProgress: function(file, loaded, total) {
var eleProgress = $("#uploadProgress_" + file.index), percent = (loaded / total * 100).toFixed(2) + '%';
if(eleProgress.is(":hidden")){
eleProgress.show();
}
eleProgress.css("width",percent);
},
onSuccess: function(file, response) {
$("#uploadProgress_" + file.index).hide();
$("#uploadSuccess_" + file.index).show();
$("#uploadInf").append("
上传成功，文件地址是：" + response + "
");
// 根据配置参数确定隐不隐藏上传成功的文件
if(para.finishDel){
// 移除效果
$("#uploadList_" + file.index).fadeOut();
// 重新设置统计栏信息
self.funSetStatusInfo(ZYFILE.funReturnNeedFiles());
}
},
onFailure: function(file) {
$("#uploadProgress_" + file.index).hide();
$("#uploadSuccess_" + file.index).show();
$("#uploadInf").append("
文件" + file.name + "上传失败！
");
//$("#uploadImage_" + file.index).css("opacity", 0.2);
},
onComplete: function(response){
console.info(response);
},
onDragOver: function() {
$(this).addClass("upload_drag_hover");
},
onDragLeave: function() {
$(this).removeClass("upload_drag_hover");
}
};
ZYFILE = $.extend(ZYFILE, params);
ZYFILE.init();
};
/**
* 功能：绑定事件
* 参数: 无
* 返回: 无
*/
this.addEvent = function(){
// 如果快捷添加文件按钮存在
if($(".filePicker").length > 0){
// 绑定选择事件
$(".filePicker").bind("click", function(e){
$("#fileImage").click();
});
}
// 绑定继续添加点击事件
$(".webuploader_pick").bind("click", function(e){
$("#fileImage").click();
});
// 绑定上传点击事件
$(".upload_btn").bind("click", function(e){
// 判断当前是否有文件需要上传
if(ZYFILE.funReturnNeedFiles().length > 0){
$("#fileSubmit").click();
}else{
alert("请先选中文件再点击上传");
}
});
// 如果快捷添加文件按钮存在
if($("#rapidAddImg").length > 0){
// 绑定添加点击事件
$("#rapidAddImg").bind("click", function(e){
$("#fileImage").click();
});
}
};
// 初始化上传控制层插件
this.init();
});
};
})(jQuery);