<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="file" id="fileimg" /> <img src="" id="viewimg" /> </body> </html> <script type="text/javascript" src="js/jquery.min.js"></script> <script> //file选项改变时 $("#fileimg").change(function() { //把选择的图片显示到img上 var fileObj = $(this)[0]; var windowURL = window.URL || window.webkitURL; var dataURL; var $img = $("#viewimg"); if(fileObj && fileObj.files && fileObj.files[0]) { dataURL = windowURL.createObjectURL(fileObj.files[0]);//要显示图片的路径 $img.attr("src", dataURL);//显示图片 //图片转换成base64 var reader = new FileReader(); reader.readAsDataURL(this.files[0]);//这一步是关键 reader.onload = function (e){ var base64=e.target.result;//这一步是关键 alert(base64); $.ajax({ type:"post", url:"......", data:{base64:base64},//base64:e.target.result async:true, dataType:"json" }); } } }) </script>