2 qq 39612909 qq_39612909 于 2017.09.14 16:00 提问

jQuery实现文件的上传

使用jQuery来实现文件的上传,
当上传成功时在浏览器上div里面显式**文件名**和下载按钮;
当上传失败时给出提示消息。

3个回答

caozhy
caozhy   Ds   Rxr 2017.09.14 16:23
sunny_desmond
sunny_desmond   2017.09.14 16:57

文件上传

orangeTop
orangeTop   2017.09.14 16:58

html:

js:
$('#select_file').fileinput({
language: 'zh', //设置语言
showUpload: true, //隐藏上传按钮
maxFileCount: 10, //输入文件数量最大为10
uploadUrl: "../../file/binUpload",//上传的地址
uploadExtraData: function () {
return {pathId: pathId, corpId: corpId};
},
allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
showCaption: false, //是否显示标题
showPreview: true,
//browseClass: "btn btn-primary", //按钮样式
dropZoneEnabled: false,//是否显示拖拽区域
//minImageWidth: 50, //图片的最小宽度
//minImageHeight: 50,//图片的最小高度
//maxImageWidth: 1000,//图片的最大宽度
//maxImageHeight: 1000,//图片的最大高度
previewSettings: {
image: {width: "190px", height: "100%"},
html: {width: "213px", height: "160px"},
text: {width: "160px", height: "136px"},
video: {width: "213px", height: "160px"},
audio: {width: "213px", height: "80px"},
flash: {width: "213px", height: "160px"},
object: {width: "213px", height: "160px"},
other: {width: "160px", height: "160px"}
},
maxFileSize: 0,//单位为kb,如果为0表示不限制文件大小
minFileCount: 0,
enctype: 'multipart/form-data',
validateInitialCount: true,
msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!",
layoutTemplates: {
actions: '

\n' +
'
\n' +
' {delete} {zoom} {other}' +
'
\n' +
' {drag}\n' +
'
\n' +
'
',
}
}).on('fileuploaded', function (event, data, previewId, index) {

});

Csdn user default icon
上传中...
上传图片
插入图片