:
HTML:
<div> <div id = "showotherimage"> </ div> <span id = "openIdCardimg"> <span> </span> <input type = "file" id = "autre_inputfile" name = "RaisonMg" /> </span> </div>
.basicInfo .Item {padding: .5rem .5rem 0; Border-top: .3rem solide #eeeeee;}. BasicInfo li {overflow: Hidden; marge-fond: .5rem; ligne de ligne: 2.1rem; Border-Bottom: 1px solide # e3e3e3;}. BasicInfo Li: dernier-enfant {border-bottom: Aucun;}. BasicInfo Input [Type = "Text"] {Height: 2Rem; LINE-HEIGHT: 2REM;}. BasicInfo TextArea {hauteur: 8rem; line-height: 1.5rem;}. BasicInfo .OtherPic {min-height: 3rem;}. BasicInfo .otherpic .addpic {height: 3rem; HEURS DE LINE: 3REM; taille de police: 3rem; marge-fond: .5rem;}. BasicInfo .OtherPic img {margin: 0 .5rem .5rem 0; Largeur: 3rem; hauteur: 3rem; Aligne verticale: haut; Border: 1px solide #ddd;}. BasicInfo .Yy_InputFile {position: Absolute; en haut: 0; à gauche: 0; Largeur: 3rem; hauteur: 3rem; OPACITY: 0;}. BasicInfo .AboutPic {margin-boot: .5rem; Heureur de ligne: 1.5rem; }JS:
var img_arr = new array (); // 相关图片 $ (page) .on ('change', '# autre_inputfile', function () {$ (this) .resizeImage ({that: this, cutwid: '', qualité: 0.6, limitewid: 710, succès: function (data) {var len = $ ('# showotherimage'). Find (iMg '). Size (); iMg_arr [Len] = Data. img = '<div style = "float: left;">' + '<img src = "' + img_arr [Len] + '">' + '<span sid = "' + len + '" id = "autre_img _" + len +' "> </ span> '+' </ div> '; 9) {$ ('# openIdCardimg'). Hide (); // 删除相关图片 $ (page) .on ('click', '. DeleteDimages', function () {var sid = $ (this) .attr ('sid'); img_arr.splice (sid, 1); $ (this) .parent (). Retire (); $ ('# showotherimage'). img = '<div style = "float: Left;">' + '<img src = "' + img_arr [i] + '">' + '<span sid = "' + i + '" id = "autre_img_' + i + '"> </ span>' + '</ div>'; $ ('# openIdCardimg'). * faire quelque chose ... *} *}) * * * / $ .fn.resizeImage = function (obj) {var file = obj.that.files [0]; var url = window.url || window.webkiturl; var blob = url.createObjectUrl (fichier); var base64; var img = new image (); img.src = blob; if (! / image /// w + /. test (obj.that.files [0] .type)) {$ .toast ("请上传图片!", 1000); retourne false; } img.onload = function () {if (img.width <obj.limitwid) {$ .toast ('图片宽度不得小于' + obj.limitwid + 'px', 1000); retourne false; } var that = this; // 生成比例 var w, échelle, h = that.height; if (obj.cutwid == '') {w = that.width; } else {w = obj.cutwid; } échelle = w / h; h = w / échelle; // 生成 Canvas var Canvas = document.CreateElement ('Canvas'); var ctx = canvas.getContext ('2d'); $ (canvas) .attr ({largeur: w, hauteur: h}); ctx.DrawImage (que, 0, 0, w, h); // 生成 Base64 Base64 = Canvas.Todataurl ('image / jpeg', obj.quality || 0,8); var result = {base64: base64}; // 成功后的回调 obj.success (résultat); }; };以上就是本文的全部内容 , 希望对大家的学习有所帮助 , 也希望大家多多支持武林网。