filereader.js - A Lightweight FileReader Wrapper
I am working on project that needs to read local files. This relies on the FileReader interface, and I couldn't find any JavaScript libraries to help out with common usage for this, so I made one.
View the project page and demo for the FileReader.js JavaScript FileReader Plugin!
FileReader is a JavaScript interface that allows you to read local files as binary. This is available in supported browsers when a user drags and drops files into a browser window or selects files from an input with a type of file. See the FileReader specification for more information.
filereader.js is a wrapper for accessing this functionality. It can be called using:
FileReaderJS.setupInput(fileInput, opts);
FileReaderJS.setupDrop(dropbox, opts);
If you use jQuery, you can access these calls with:
$("#fileInput").fileReaderJS(opts);
$("#dropbox").fileReaderJS(opts);
To see the full range of options and functionality, view the readme.
filereader.js is available under the MIT License. See the full filereader.js code or the single file raw javascript source on github.
You can see an example project using filereader.js on Instant Sprite, a browser based CSS Sprite Generator that I am working on. Try dragging images onto the body, or clicking to add multiple image files to see what is possible.
August 16th, 2012 at 7:35 am
[…] FileReader.js is intended to make accessing files via the FileReader interface easier. Read more about the motivation behind filereader.js. […]
November 5th, 2012 at 10:53 am
it’s one good master ;)
http://speckyboy.com/2012/10/30/getting-to-grips-with-the-html5-file-api-2/
April 5th, 2013 at 8:58 am
[…] FileReader.js is intended to make accessing files via the FileReader interface easier. Read more about the motivation behind filereader.js. […]
April 15th, 2013 at 12:13 am
[…] FileReader.js is intended to make accessing files via the FileReader interface easier. Read more about the motivation behind filereader.js. […]
November 14th, 2013 at 12:37 am
how can I use the $_files[] on the file-drop-zone.instead of using file_puts contents(),for file validation purpose server side.I do not want to show the input element.
eg this examplehere:http://tutorialzine.com/2011/09/html5-file-upload-jquery-php . used paramname:pic, like so
how can I do this in filereader.js
April 4th, 2015 at 7:18 pm
Super cool! nice work! I’m using it on my project!
May 1st, 2016 at 8:09 pm
[…] 项目地址:http://www.briangrinstead.com/blog/filereaderjs […]