<!DOCTYPE HTML><HTML><Head><title>HTML5 Upload picture Preview</title><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8"><Scriptsrc= "/js/jquery.js"></Script></Head><Body><H3>Please select picture file: Jpg/gif</H3><formname= "Form0"ID= "Form0"runat= "Server"enctype= "Multipart/form-data" ><inputtype= "File"name= "file0"ID= "FILE0"multiple= "multiple" /><BR><imgsrc=""ID= "Img0" ><Asp:buttonID= "Button1"runat= "Server"Text= "Save"onclick= "Button1_Click" /><Script> $("#file0"). Change (function(){ varObjurl=Getobjecturl ( This. files[0]) ; Console.log ("Objurl ="+Objurl); if(Objurl) {$ ("#img0"). attr ("src", Objurl); }}) ;//Create a URL that can be accessed to the filefunctionGetobjecturl (file) {varURL= NULL ; if(Window.createobjecturl!=undefined) { //BasicURL=window.createobjecturl (file); } Else if(window. URL!=undefined) { //Mozilla (Firefox)URL=window. Url.createobjecturl (file); } Else if(Window.webkiturl!=undefined) { //WebKit or ChromeURL=Window.webkitURL.createObjectURL (file); } returnURL;}</Script></form></Body></HTML>
Background:
usingSystem.IO;usingSystem.Drawing; Public Partial classdemo:system.web.ui.page{protected voidPage_Load (Objectsender, EventArgs e) {}//Save pictureprotected voidButton1_Click (Objectsender, EventArgs e) {Httppostedfile Imgfile= request.files["FILE0"]; Imgfile. SaveAs (Server.MapPath ("~/abc.jpg")); }}
Note: the enctype= "Multipart/form-data" in the form means that the MIME encoding of the form is set. By default, this encoding format is application/x-www-form-urlencoded and cannot be used for file uploads;
Multipart/form-data to complete the transfer of file data.
HTML5 Upload picture Preview