How html5 reads local files
This article is about how html5 reads local files. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.
The structure style of html is as follows:
Add Picture
In terms of style, the input box of the input element should not be displayed. At this time, you need to set the input to a transparent style, and then cover it over the button element before you can click the button to upload the picture. If you set the accepted setting to "image / *", only picture files are allowed to upload. Css style
As follows
.addpic {
Position:relative
Margin-left:100px
Width: 95 pixels
Height: 30 pixels
}
.addlogo {
Background: no repetitive scrolling 0 0 rgba (0meme 0re0j0p0pl 0)
Cursor: pointer
Font-size:30px
Opacity: 0
Location: absolutely
Correct: 0
Maximum: 0
Z index: 10
}
Js code
Function readFiles (evt) {
Var files = evt.target.files
If (! Files) {
Console.log ("File compromised")
Return
}
For (var I = 0 files file; file = files [I]; I + +) {
Var imgele = new Image ()
Var thesrc = window.URL.createObjectURL (file)
Imgele.src = thesrc
Imgele.onload = function () {
$("# showlogo") Attr ("src", this.src)
}
}
}
$(document) .ready (function () {
$("# logoimg") Change (function (e) {
ReadFiles (e)
})
})
Thank you for reading! This is the end of the article on "how html5 reads local files". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it out for more people to see!
