single_file_upload.js
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
|
var
YsUIWidgets=YsUIWidgets||{};
YsUIWidgets.uploadFile = (
function
($){
var
container =
null
;
var
changeCallback =
function
(){};
var
acceptTypes = [
"jpg"
,
"png"
];
// 接受的上传文件类型
var
renderHtml =
"<input type='file' name='single-file-upload' style='display:none;'/>"
;
// 添加隐藏的
function
renderInputFile(){
// 生成dialog唯一标识
container = $(renderHtml).appendTo(
"html"
);
// 添加到文档中去
return
container;
}
function
bindEventHandlers(){
$(container).change(
function
(e){
e.preventDefault();
e.stopPropagation();
var
file = e.target.files[0];
if
(!validateFileType(file,acceptTypes)){
alert(
"文件类型不正确!"
);
return
;
}
changeCallback(file);
// 清除value
$(
this
).val(
""
);
});
}
// 验证文件类型
function
validateFileType(file,acceptTypes){console.log(
"valid"
);
var
name = file.name;
var
fileSuffix = name.substr(name.lastIndexOf(
"."
)+1);
for
(
var
i=0;i<acceptTypes.length;i++){
var
acceptType = acceptTypes[i];
if
(acceptType==fileSuffix){
return
true
;
}
}
return
false
;
}
var
initialized =
false
;
// 初始化方法
function
init(){
if
(initialized){
return
;
}
renderInputFile();
bindEventHandlers();
initialized =
true
;
}
var
uploadFile =
function
(options){
if
(!initialized){init();}
// 如果未初始化则初始化
changeCallback = options.changeCallback||changeCallback;
acceptTypes = options.acceptTypes||acceptTypes;
$(container).click();
};
return
uploadFile;
})(jQuery);
|
本文转自 antlove 51CTO博客,原文链接:http://blog.51cto.com/antlove/1864250