//上传图片构造函数
function FileUploader(targetId, uploadInputId, uploadFormId,
picAreaId, delUrl, targetInput, fileName) {
this.targetId = targetId;
this.uploadInputId = uploadInputId;
this.uploadFormId =
uploadFormId;
this.picAreaId = picAreaId;
this.delUrl =
delUrl;
this.targetInput = targetInput;
this.iframeName =
undefined; //当前iframe的名字
this.fileName = fileName; //当前iframe的名字
return {
upload: this.upload,
apendPic:
this.apendPick
};
};
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70 |
<br>//开始上传FileUploader.prototype.upload = function
() { $(‘#‘
+ this.targetId).click(function
() { $(‘#‘
+ this.uploadInputId).click(); });};//添加图片FileUploader.prototype.appendPic = function
() { var
fileId = this.fileName.substring(0, this.fileName.indexOf(‘.‘)); var
picHtml = ‘<div id="‘
+ fileId + ‘div" style="float: left; margin-left: 5px; position: relative"><a id="‘
+ fileId + ‘del" style="height: 20px; width: 20px; position: absolute; top: -2px; right: -5px; z-index: 10;" class="panel-tool-close" /><img id="‘
+ fileId + ‘" style="border: 10px solid #ddd; padding: 5px; width: 100px; height: 80px;" src="../content/FileUploaders/‘
+ this.fileName + ‘" /></div>‘; $(‘#‘
+ this.picAreaId).append(picHtml); //绑定删除事件 $(‘#‘
+ fileId + ‘del‘).click(function
() { this.delPic(); }); //绑定图片点击事件 $(‘#‘
+ fileId).click(function
() { window.open(‘/picupload/picview?imgname=‘
+ fileName); }); //添加图片名到input $(‘#‘
+ targetInput).val($(‘#‘
+ targetInput).val() + ‘,‘
+ fileName);};//删除图片FileUploader.prototype.delPic = function
() { $.post(this.delUrl, { imgname: this.fileName }, function
(data) { //提示 if
(data.msg.toLowerCase() == ‘true‘) { msgNotify(‘删除成功!‘); } else
{ msgNotify(‘删除失败!‘); }; //删除div $(‘#‘
+ fileId + ‘div‘).remove(); //删除input中的对应图片名 if
(data.msg.toLowerCase() == ‘true‘) { var
fileNames = $(‘#‘
+ this.targetInput).val(); fileNames = fileNames.replace(eval("/"
+ this.fileName + "/gi"), ‘‘); $(‘#‘
+ this.targetInput).val(fileNames); }; });};//绑定上传控件change事件FileUploader.prototype.uploaderChange = function
() { //设置easyui $(‘#‘
+ this.targetId + ‘ span span‘).html(‘正在上传中‘); $(‘#‘
+ this.targetId).unbind(‘click‘); //提交表单 this.iframeName = ‘uploadIframe‘
+ Math.random(); var
iframe = $(‘<iframe width="0" height="0" frameborder="0" name="‘
+ this.iframeName + ‘">‘); iframe.appendTo($(‘body‘)); $(‘#‘
+ this.uploadFormId).attr(‘target‘, iframeName); $(‘#‘
+ this.uploadFormId).submit();};//绑定iframe 加载完成事件FileUploader.prototype.iframeOnload = function
() { //设置Easyui $(‘#‘
+ this.targetId + ‘ span span‘).html(‘选择打款凭证‘); $(‘#‘
+ this.targetId).bind(‘click‘, function
() { $(‘#‘
+ this.uploadInputId).click(); }); //读取iframe页面回传的值 this.fileName = $(window.frames[this.iframeName].document).find("input").val(); //添加图片 this.appendPic();}; |
原文:http://www.cnblogs.com/wuMing-dj/p/3588093.html