效果如下:
html:
<div> <div id =“ show hotherimage”> </div> <span ID =“ OpenIdCardimg”> <span> <Span> </span> <input type =“ file” id =“ deles_inputfile” name =“ coniceimg”/> </span> </span> </div>
.basicinfo .Item {填充:.5REM .5REM 0;边界顶:.3rem solid #eeeee;}。基本ininfo li {溢出:hidden;边缘底:.5REM;线高:2.1REM;边界底:1px实心#e3e3e3;}。basicinfo li:last-child {border-bottom:none;}。basicinfo input [type =“ text”]线高:2REM;}。基本Info TextArea {高度:8REM;线高:1.5REM;}。基本Info .otherpic {min-height:3rem;}。basicInfo .otherpic .addpic {height {height:3rem;线高:3REM;字体大小:3REM; margin-bottom:.5REM;}。basicInfo .Hotherpic img {margin:0 .5REM .5REM 0;宽度:3REM;身高:3REM;垂直分组:顶部;边框:1px固体#ddd;}。basicinfo .yy_inputfile {position:absolute;顶部:0;左:0;宽度:3REM;身高:3REM;不透明度:0;}。basicInfo .aboutpic {margin-tom:.5rem;线高:1.5REM; }JS:
var img_arr = new array(); //相关图片$(page).on('change','#其他_inputfile',function(){$(this).resizeImage({that:this:this,cutwid:'',质量:0.6,limitwid:710,success,success,success:function(data) img ='<div style =“ float:left;”>' +'<img src =“' + img_arr [len] +'“>' +'<span Sid =”' + len +'“ id =” 9 $('#OpenIdCardimg')。 //删除相关图片$(page).on('click','。deletedImages',function(){var sid = $(this).attr('sid''); img_arr.splice(sid,1); $($($(this).parent(this).parent().parent().parent()。emover(); emove(); $ speathereimage; $ show phyShimage'#show hyphereimage'' {var img ='<div style =“ float:left;”>'<img src =“' + img_arr [i] +' +' +'<span sid =“' + i +'” 9){$('#OpenIdCardimg')。show();} else {$('#OpenIdCardimg')。 (data){ *做某事... *} *}) * * */ $ .fn.ResizeImage = function(obj){var file = obj.that.files [0]; var url = window.url || window.webkiturl; var blob = url.CreateObjectUrl(file); var base64; var img = new Image(); img.src = blob; if(!/image /// w+/。test(obj.that.files [0] .type)){$ .toast(“ 请上传图片!”,1000);返回false; } img.onload = function(){if(img.width <obj.limitwid){$ .toast('图片宽度不得小于' + obj.limitwid +'px',1000);返回false; } var that = this; //生成比例var w,比例,h = that.height; if(obj.cutwid ==''){w = that.width; } else {w = obj.cutwid; }比例= w / h; h = w / scale; //生成帆布var canvas = document.createelement('canvas'); var ctx = canvas.getContext('2d'); $(canvas).attr({width:w,height:h}); ctx.drawImage(That,0,0,W,H); //生成base64 base64 = canvas.todataurl('image/jpeg',obj.quality || 0.8);变量结果= {base64:base64}; //成功后的回调obj.success(结果); }; };以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持武林网。,也希望大家多多支持武林网。