jQuery-File-Upload 使用,jQuery-File-Upload上传插件

阅读更多

jQuery-File-Upload 使用,jQuery-File-Upload上传插件

 

================================

©Copyright 蕃薯耀 2018年9月26日

http://fanshuyao.iteye.com/

 

一、官网地址:

https://github.com/blueimp/jQuery-File-Upload

 

二、使用文档(参数说明)

https://github.com/blueimp/jQuery-File-Upload/wiki/Options

 

三、浏览器支持(官网说明)

  • Google Chrome
  • Apple Safari 4.0+
  • Mozilla Firefox 3.0+
  • Opera 11.0+
  • Microsoft Internet Explorer 6.0+

 

四、jQuery-File-Upload 入门使用

 

1、最简单的使用方法:





jQuery File Upload Example








 

 如果不使用iframe,jquery.iframe-transport.js文件可以不引用。

 

 

 

2、自定义使用

 

不显示文件选择框,只显示上传按钮

上传mdb文件 

 

控件初始化:

$(function(){
	
	$("#btnUploadMdbFile").click(function(){
		$("#inputUploadMdbFile").click();
	});
	
	//multiple 多选
	//input限制文件上传可以使用(IE9+): accept="application/msaccess" accept="image/*"
	$("#inputUploadMdbFile").fileupload({
		url : "${pageContext.request.contextPath}/xxx/fileUploadAction.go?method=fileUpload",
		dataType: "json",
		//autoUpload: false,
		formData: {
			"dirPath" : "temp_dir/mdb/"
		},
		add: function(e, data){
			//var acceptFileTypes = /^(gif|jpe?g|png)$/i;
			var acceptFileTypes = /^mdb$/i;
			var files = data.originalFiles;
			if(files && files.length > 0){
				var isPass = true;
				for(var i=0; i 0){
				var file = data.result.files[0];
				if(file.suffix == ".mdb"){
					dealMdbFile(file.absolutePath);
				}else{
					top.$.messager.alert("系统提示","只能上传*.mdb文件","info"); 
				}
			}
		}
	});
	
});

 

formData:可以传递自己的参数。

add: function(e, data){}:增加控制文件的类型限制,这个可以省略。

done: function(e, data){}:上传成功后结果返回处理。

 

更多参数设置见:

https://github.com/blueimp/jQuery-File-Upload/wiki/Options

 

 

================================

©Copyright 蕃薯耀 2018年9月26日

http://fanshuyao.iteye.com/

 

 

 

 

 

 

 

  • jQuery-File-Upload-9.22.0.zip (114.1 KB)
  • 下载次数: 18

你可能感兴趣的:(使用,jquery文件上传插件,蕃薯耀)