实现网易邮箱多附件上传及时判断文件类型并自动移除危险文件

项目在用多附件上传,在网友已实现的网易邮箱多附件上传的基础上,对文件类型进行判断,并自动移除危险文件。

<div id="tdtAttach">
         <input id="my_file_element" type="file"  name="fileList"/>
	<br>
	<!-- Multifiles upload secion -->
	<div id="files_lists" style="font-size: 11px;padding-top: 10px; line-height: 140%"></div>
	<script>
		 var multi_selector = new MultiSelector(document.getElementById('files_lists'));
                   multi_selector.addElement(document.getElementById('my_file_element'));
	</script>
	<!-- end of Multiflies upload -->
</div>		


javaScript部分

			var max =500;//最大文件数
			var ki = 0;	 //标志
			
			function checkFileCount(obj){
				alert("bb");
				if(obj.checked==true){
					if(multi_selector.count > max){
						alert("附件不能超过"+max+"个");
						return false;
					}else{
						multi_selector.count++;
					}
				}else{
					multi_selector.count--;
				}
				if(multi_selector.count>max) 
					multi_selector.current_element.disabled=true;
				else
					multi_selector.current_element.disabled=false;
			}
			
			function MultiSelector(list_target){
				this.list_target=list_target;
				this.count=<s:property value="#request.fList.size" default="0"/>;
				this.id=0;
				if(max){
					 this.max=max;
			    }else{
				     this.max=-1;
				};
				//页面初始化时添加一个input file。
				this.addElement=function(element){
					     ki++;	
						  if(element.tagName=='INPUT' && element.type=='file'){
								element.name='fileList';
								element.id ="my_file_element"+ki;
								element.multi_selector=this;
								element.style.padding="2px";
								//定义前一个的input file 的onchange事件,onchange时,创建一个新的input file,使页面永远有一个input file可供使用。
								element.οnchange=function(){
									var new_element=document.createElement('input');
									new_element.type='file';
									new_element.id='file'+ki
									this.parentNode.insertBefore(new_element, this);
									this.multi_selector.addElement(new_element);
									this.multi_selector.addListRow(this);
									this.style.position='absolute';
									this.style.left='-1000px';
								};
								if(this.max !=-1 && this.count >=this.max){element.disabled=true;};
								this.count++;
								this.current_element=element;
							} else {
								alert('Error: not a file input element');
							};
					};
				//下方文件列表 后跟红色叉号可以删除文件 
				this.addListRow=function(element){
					var new_row=document.createElement('div');
					var new_row_button=document.createElement('a');
					var myText=document.createTextNode('X');
					new_row.id = "div"+ki;
					new_row_button.href='#';
					new_row_button.style.color='#FF0000';
					new_row_button.style.fontFamily='Arial';
					new_row_button.style.fontWeight='bold';
					new_row_button.appendChild(myText);
					new_row.element=element;
					new_row_button.οnclick=function(){
						this.parentNode.element.parentNode.removeChild(this.parentNode.element);
						this.parentNode.parentNode.removeChild(this.parentNode);
						this.parentNode.element.multi_selector.count--;
						this.parentNode.element.multi_selector.current_element.disabled=false;
						return false;
					};
					//获取当前选择文件,获取文件类型,若不是指定文件类型,移除文件列表中的文件,并且清空input file的值
					upload=element.value;
				    var str = upload.substring(upload.lastIndexOf('.')+1,upload.length).toLowerCase();
				    if(!(str=='bmp' || str=='jpg' || str=='gif' || str=='png')){
						alert("对不起,您选择上传的文件不是bmp,jpg,gif,png格式,请您重新选择的文件!");
						document.getElementById("tdtAttach").removeChild(document.getElementById("my_file_element"+(ki-1)));
						multi_selector.count--;
					    multi_selector.current_element.disabled=false;
						return false;
			      	}
  				    new_row.innerHTML='<span class=uflist>'+element.value+'</span> ';
					new_row.appendChild(new_row_button);
					this.list_target.appendChild(new_row);
				};//end of addListRow
				
			};


 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值