码迷,mamicode.com
首页 > Web开发 > 详细

jquery上传base64位图片

时间:2017-02-03 12:34:24      阅读:212      评论:0      收藏:0      [点我收藏+]

标签:input   error   run   alert   bst   url   hang   pat   网络   


  <img id="articleImg" width="180" height="100">
  <input type="file" value="上传" id="articleImg


1
$(#articleImgBtn).change(function(){ 2 run(this, function (data) { 3 uploadImage(data); 4 }); 5 }); 6 7 function run(input_file, get_data) { 8 /*input_file:文件按钮对象*/ 9 /*get_data: 转换成功后执行的方法*/ 10 if (typeof (FileReader) === undefined) { 11 alert("抱歉,你的浏览器不支持 FileReader,不能将图片转换为Base64,请使用现代浏览器操作!"); 12 } else { 13 try { 14 /*图片转Base64 核心代码*/ 15 var file = input_file.files[0]; 16 //这里我们判断下类型如果不是图片就返回 去掉就可以上传任意文件 17 if (!/image\/\w+/.test(file.type)) { 18 alert("请确保文件为图像类型"); 19 return false; 20 } 21 var reader = new FileReader(); 22 reader.onload = function () { 23 get_data(this.result); 24 } 25 reader.readAsDataURL(file); 26 } catch (e) { 27 alert(图片转Base64出错啦! + e.toString()) 28 } 29 } 30 } 31 32 function uploadImage(img) { 33 //判断是否有选择上传文件 34 var imgPath = $("#articleImgBtn").val(); 35 if (imgPath == "") { 36 alert("请选择上传图片!"); 37 return; 38 } 39 //判断上传文件的后缀名 40 var strExtension = imgPath.substr(imgPath.lastIndexOf(.) + 1); 41 if (strExtension != jpg && strExtension != gif 42 && strExtension != png && strExtension != bmp) { 43 alert("请选择图片文件"); 44 return; 45 } 46 $.ajax({ 47 type: "POST", 48 url: ’上传图片接口‘, 49 data: { token: token,file: img.substr(img.indexOf(,) + 1)}, //视情况将base64的前面字符串data:image/png;base64,删除 50 cache: false, 51 success: function(data) { 52 alert("上传成功"); 53 $("#articleImg").attr(src, JSON.parse(data).imageUrl); 54 }, 55 error: function(XMLHttpRequest, textStatus, errorThrown) { 56 alert("上传失败,请检查网络后重试"); 57 } 58 }); 59 }

 

jquery上传base64位图片

标签:input   error   run   alert   bst   url   hang   pat   网络   

原文地址:http://www.cnblogs.com/cutone/p/6362321.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!