本地文件上传或URL文件上传

2019独角兽企业重金招聘Python工程师标准>>>

<div class="form-group spec4uploadOnly">
			<label class="col-xs-2 col-sm-2 col-md-2 col-lg-2 control-label"></label>
			   <div class="row col-sm-8">
			      	<div class="col-sm-12">
			          	<input type="file" id="uploadBtn1" style="display:none;"/>
				 		<button type="button" id="localBtn" class="btn green_btn col-sm-2 uploadBtn"><s:text name="coocLocalUpload" /></button>
						<button type="button" id="urlBtn" class="btn green_btn col-sm-2 uploadBtn"><s:text name="coocUrlAddr" /></button>
						<div id='queuelist' style="width:260px;margin-left:300px;"></div>
					</div>
					<div class="url" style="display:none">
					   <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10 mgt10">
	                      <input type="text" class="form-control" placeholder="<s:text name="coocPleInputUrlAddr"/>">
                       </div>
                       <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 mgt10">
	                      <button type="button" id="urlDelBtn" class="btn btn-default blue_btn col-sm-1 deleteBtn"></button>
                       </div>
					</div>
				 <!-- 	<div id='queuelist' style = "width:260px;margin-left:700px;"></div>  -->
					    
			    </div>
		</div>

$("#urlBtn").click(
			function() {
				$("div.url").css("display","block");
				$("div.url").siblings(".fileLocal").remove();
			}
	);
	$("#urlDelBtn").click(
			function() {
				$("div.url").css("display","none");
			}
	);
	function uploadRender() {
		$("#uploadBtn1").uploadify({
			width		  : 80,
			height		  : 35,
		    buttonText    : '<s:text name="uploadMySource"/>',
		    swf           : '<%=basePath%>resource/script/plugins/uploadify/uploadify.swf',
		    uploader      : '<%=basePath%>upload',
		    fileSizeLimit   : 1000*1024,
		    fileTypeExts : '*.gif;*.zip;*.jpg;*.jpeg;*.exe;*.bmp;*.exe;*.apk;*.png;*.doc;*.docx;*.ppt;*.pptx;*.pdf;*.mp4;*.flv;*.rm;*.rmvb;*.3gp;*.mkv;*.avi;*.wmv;*.mp3;*.txt;*.epub;*.xls;*.xlsx',
		    fileTypeDesc : 'select',
		    multi : true,
		    uploadLimit : 0,
		    queueID  :  'queuelist',
		    onSelectError : function(file,errorCode,erorMsg){
		    	switch(errorCode) {
	             case -100:
	            	 this.queueData.errorMsg ="<s:text name='errorMsg1'/>";
	            	 break;
	             case -110:
	            	 this.queueData.errorMsg ="<s:text name='errorMsg2'/>";
	                 break;
	             case -120:
	            	 this.queueData.errorMsg ="<s:text name='errorMsg3'/>";
	                 break;
	         	}
	    	},
		    onQueueComplete : function(queueData){
		    	//$("#fileid").val(id);  $("#arr").val(arr);
			},
			onUploadSuccess : function (event, ID, fileObj, response, data) {//当文件上传完成时触发  
				//id = id+ID+'|'; name = event.name; arr = arr + name + '|';
				var elementId = ID.substring(0,ID.indexOf("."));
				uploadFile.initData({id:elementId, name:event.name, rId:(ID+"|"), rName:(event.name+"|")});
				uploadFile.add();
			}	
		});
	}
	var uploadFile = {
		param: {id:'',name:''},
		initData : function(options) {
			this.param = $.extend({},this.param,options);
		},		
		html : '<div class="fileLocal"><div class="col-xs-10 col-sm-10 col-md-10 col-lg-10 mgt10">'
		       +'<input class="form-control"></div>'
		       +'<div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 mgt10">'
		       +'<button type="button" class="btn btn-default blue_btn col-sm-1 deleteBtn"></button></div>'
		       +'</div>',	   
		add : function() {
			var p = this.param;
			var temp = $(this.html);
			temp.find("input").attr("id","filename_"+p.id).val(p.name);
			console.log(p.id+"----"+p.name);
			temp.find("button.deleteBtn").attr("id","deleteBtn_"+p.id).click(function(){
				uploadFile.remove(p.id);
				uploadFile.reset("remove",p.rId,p.rName);
			});
			var len = $("div.url").siblings(".fileLocal:last").length;
			//var len = $("div.fileLocal").length;
			if(len>0){
				$("div.fileLocal:last").after(temp);
			}else{
				$("div.url").after(temp);
			}				
			uploadFile.reset("add",p.rId,p.rName);
			$("div.url").css("display","none");
		},
		remove : function(id) {			
			showConfirm('<s:text name="coocDelMessage1"/>',function(){
				//var clas = $("#deleteBtn_"+id).parent().parent().attr("class");//localFile
				console.log("============");
			    $("#deleteBtn_"+id).parent().parent().remove();
			});
		},
		reset : function(flag,rId,rName) {
			var id = $("#fileid").val(), 
			name = $("#arr").val();
			console.log("rId:"+rId+" rName:"+rName);
			if(flag=='add') {
				id = id + rId;
				name = name + rName;	
				console.log("----------add------id:"+id+" name:"+name);
			} else if (flag=="remove"){
				id = id.replace(rId,"");
				name = name.replace(rName,"");
				console.log("-----------remove--------------id:"+id+" name:"+name);
			}
			$("#fileid").val(id); 
			$("#arr").val(name);			
			//console.log($("#fileid").val() + "---" + $("#arr").val());
		}
	};

转载于:https://my.oschina.net/u/2342541/blog/536035