ajaxFileUpload onchang第二次失效

前端之家收集整理的这篇文章主要介绍了ajaxFileUpload onchang第二次失效前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ajaxFileUpload 用onchang上传只能上传一次 第二次就失效了 我找这个问题找了很长时间,试了很多种方法都不行,皇天不负有心人 终于被我找到解决办法了。


<form action="" id="form1" method="post" enctype="multipart/form-data">
	<input type="hidden" id="openid" name="openid" value="${openid}" />
	<input type="hidden" id="id" name="id" value="${id}" />
	<input type="hidden" id="clmno" name="clmno" value="${clmno}" />
	<input type="hidden" id="updtype" name="updtype" value="01" />
	<div class="page-content">
		<div class="top"><a href="#" class="but">上传资料</a></div>
		<br/>
		<section class="trial">
	        <header><span>理赔申请书</span></header>
        	<div class="file" id="div_file_01">
	        	<input type="file" id="multiFiles01" name="multiFiles"/>
				<img class="src" src="../images/upload/add.jpg" width="100" height="100"/>
        	</div>
		</section>
	</div>
</form>

/*监听所有file下的input的事件 最原始方法 只能上传一次*/
	$(".file input").chang(function(){
		console.log(this.id);
		var file = this.files;
		if(file.length==0){
			$("#msgAlert").html("请选择一张图片");
			$("#alertMsg").show();
		}else{
			for(var i = 0; i < file.length; i++) {
				readAsDataURL(file[i],$(this).parent(),this.id);
			}
		}
	});


/*监听所有file下的input的事件   这是我修改之后的,可上传多次*/
	$(".file input").live("change",function(){//
		console.log(this.id);
		var file = this.files;
		if(file.length==0){
			$("#msgAlert").html("请选择一张图片");
			$("#alertMsg").show();
		}else{
			for(var i = 0; i < file.length; i++) {
				readAsDataURL(file[i],this.id);
			}
		}
	});

$.ajaxFileUpload({
        url:"${ctx}claim/uploadImgFile.action?"+str,//需要链接到服务器地址  
        secureuri:false,fileElementId:id,dataType: 'json',success: function (data,status){
        	var flag = data.model.success;
        	if(flag==true){
        		var reader = new FileReader();
        		reader.readAsDataURL(file);
        		reader.onload = function(e) {
        			var idtime = new Date().getTime();
        			var divId = "divId_"+idtime;
        			var tt = '<div class="view" id="'+divId+'" ><img class="view_img" src="' + this.result + '"/>'
        			+'<a href="#" onclick=\'deleteImg("'+divId+'")\'>删除</a></div>';
        			$(par).before(tt);
        			//重的一步,如果没有这一步 onchang事件只能一次
        			$("#"+id).replaceWith('<input type="file" id="multiFiles01" name="multiFiles"/>');
        		}; 
        	}
        },error: function (data,status,e){//相当于java中catch语句块的用法  
        	$("#msgAlert").html("上传失败,请重新上传!");
        	$("#alertMsg").show();
        }  
    });
原文链接:https://www.f2er.com/ajax/161615.html

猜你在找的Ajax相关文章