js图片上传并预览

Posted 2020-09-09

 1  <form id="addpic" class="easyui-form" method="post" enctype="multipart/form-data">
 2         <input type="file" onchange="previewFile()" name="pictureFile" id="file"
 3                style="width:150px;margin-top:20px;padding:3px;border:none;"
 4                onchange="submit()"/>
 5         <input class="textbox" id="basem" name="basem" type="hidden"><br>
 6 </form>
 7 
 8             function previewFile() {
 9                 document.querySelector(‘input[type=file]‘).files[0];
10                 var file = $(‘#file‘).get(0).files[0];
11                 var reader = new FileReader();
12                 reader.readAsDataURL(file);
13                 if (file) {
14                     reader.onloadend = function () {
15                      
16                         $("#yulan").attr("src", reader.result);
17                         $("#basem").val(reader.result)
18                     }
19                 }
20             }

将图片的base64码存入数据库中