JS implementation of picture Preview and Formdata upload __js

1. HTML

<!--preview picture-->
<div class= "File-image" > 
</div>

<!--add picture-->
<div class= "file-btn" >
  add Picture
  <input type= "file" @change = "AddImage" id= " File ">
</div>

<!--upload image-->
<button> upload </button>

Preview Picture js

var file;

var addimage = function () {
    file = JQuery ('. file ') [0].files[0];
    Add a picture path to the IMG src to preview
    jQuery (' #iamge '). attr (' src ', getobjecturl (file));
    Different browsers under different path
     function Getobjecturl (file) {
          var url = null;
          if (window.createobjecturl!= undefined) {//basic
            URL = window.createobjecturl (file);
          } else if (window. URL!= undefined) {//Mozilla (firefox)
            url = window. Url.createobjecturl (file);
          else if (window.webkiturl!= undefined) {//WebKit or chrome
            URL = window.webkitURL.createObjectURL (file);
          return
          URL;
        }

using formdata upload image js

 var imgdata = new FormData ();
 Imgdata.append ("img", file); Upload Jquery.ajax using Ajax ({type: "Put", Url:url, Data:imgdata, Async:false, cache : false, Contenttype:false, Processdata:false, success:function (data) {alert ("Upload succeeded"
        ); }, Error:function (JQXHR) {alert ("Upload Failed"}})