js 图片压缩

图片上传，如果图片太大，必定会导致速度慢，如果后台对图片的要求不是太高，那么可以试试接下来的方式

<script type="text/javascript" src="../js/lrz.mobile.min.js"></script>
<input id="file" class="file" name="file" type="file" multiple />

var input = document.getElementById("file");
var req;
function ys(){
	
	var f = input.files[0];
	var fe = input.files[0];
	var picture = input.value;
	var FR = new FileReader();
	FR.readAsDataURL(f);
	var subimg = new Image();
	var show_img = new Image();
	var filedata=show_img.src;
	if (picture.match(/.jpg|.jpeg/i)){
		var ldot = picture.lastIndexOf(".");
        	var type = "&type="+picture.substring(ldot + 1);
        	FR.onload = function(f){
	    		subimg.src =this.result;
    			if(subimg.width>3000||subimg.height>3000){
    	        		 var subwidth=subimg.width;
    	        		 var subheight=subimg.height;
    				 var wremainder=parseInt(subwidth/3000);
				 var hremainder=parseInt(subheight/3000);
				 if(wremainder>=hremainder){
			         	for(var i=0; i<wremainder; i++){
		               			if(subwidth>3000|| subheight>3000){
						 	subwidth = subwidth/2; 
						  	subheight = subheight/2; 
			  			}
			 		}
				 }else{
					for(var i=0; i<hremainder; i++){
		              			if(subwidth>3000|| subheight>3000){
						      subwidth = subwidth/2; 
						      subheight = subheight/2; 
			  			}
			 		}
				}
    		  		lrz(fe,{width:subwidth,quality:0.5},function(rst){
		               		filedata =  rst.base64;
		               		var url="http://域名//项目名称/DoAllCardReconPage";
		            		if (window.XMLHttpRequest) {
		               			req = new XMLHttpRequest();
		            		}else if (window.ActiveXObject) {
		                		req = new ActiveXObject("Microsoft.XMLHttp");       
		                	}
		            		if (req){
			            		var input=filedata.substring(filedata.indexOf(",") + 1);
			            		var strsrc="strsrc="+input;
			            		req.open("POST", url, true); 
		                		req.setRequestHeader("Content-type","application/x-www-form-urlencoded");
		                		req.onreadystatechange =callback; //若后台有返回值是调用
		                		req.send(strsrc+type);
		              		}
                 		});
			}
		}
	}
}



/**
 * 回传值
 */
function callback() {
    if (req.readyState == 4) {
        if (req.status == 200) {
           var rt=req.responseText;//显示xml结果
           
		}
	}
}

此处用的是先对较大图片进行了像素等比压缩后，在进行了一次质量的压缩将原本1.2M的图片压缩到一二百K的样子