html5+ photo upload and select File Upload

The HTML page content contains the following tags:

                   <inputID= "Btn_select"type= "button"value= "Select from album" />                   <inputID= "Btn_takephoto"type= "button"value= "Take pictures" />                   <imgID= "Imgviewer"src=""alt= "No picture"width= "+"Height= "+"/>                   <inputID= "Btn_save"type= "button"value= "Confirm Upload" />

JS Implementation section:

(function() {    varurl = "xxxxxxxxxx uploaded file Address"; varfile; varW =NULL; //H5 Plus event handling    functionPlusready () {//w=plus.nativeui.showwaiting ();        //H5 when ready to bind a photo event                //Photo Stand-alone event$ ("#btn_takephoto"). Bind ("click",function() {            //Take PicturesPlus.camera.getCamera (). Captureimage (function(P) {Plus.io.resolveLocalFileSystemURL (P),function(Entry) {Console.log (Entry.tolocalurl ()); $("#imgViewer"). attr ("src"), Entry.tolocalurl ()); }, function(e) {outLine ("Read photo file Error:" +e.message);            });        });                  }); //Select from album$ ("#btn_select"). Bind ("click",function() {Plus.gallery.pick (function(P) {Console.log (P); $("#imgViewer"). attr ("src"), p);        });                }); //Uploading Files$ ("#btn_save"). Bind ("click",function() {            varwt =plus.nativeUI.showWaiting (); //read to file according to pathPlus.io.resolveLocalFileSystemURL ($ ("#imgViewer"). attr ("src"),function(Entry) {Entry.file (function(file) {varFileReader =NewPlus.io.FileReader ();                        Filereader.readasdataurl (file); Filereader.onloadend=function(e) {varF = $ ("#imgViewer"). attr ("src")); varfilename = f.replace (f.substring (0, F.lastindexof ('/') + 1), "); varparam ={filename:filename datainput:e.target.result.tostring ()}; //Custom Ajax MethodsToolhelper.asyncajax (URL, param,function(data, para) {wt.close (); if(Data[0].responsecode! = undefined && Data[0].responsecode! = "") {$.dialog.alert (data[0].responsemessage); } Else{$.dialog.alert ("Upload succeeded");            }                });          }             });                                            });    }); }    if(window.plus) {plusready (); } Else{Document.addeventlistener ("Plusready", Plusready,false); }    returnBaseobj ={save:saveedit};}) ();

JavaScript

The above two sections use the camera-related events and methods in the Dcloud html+, as well as the way in which IO fetches the file stream based on the address, and the image uploaded to the server is Base64, so if the server needs to save the picture needs decoding.

html5+ photo upload and select File Upload