HTML external file read/write

1. Read the file

External file Read control:

<type= "file"  ID= "File_jquery"  onchange= "File_ jquery (this.id) "/>

Call Function:

function File_jquery (ID) {        var a = $ ("#" +id);        var selectedfile = $ ("#" +id) [0].files[0];        Console.log (a);        Console.log (selectedfile);    }

By loading the file, Console.log prints the validation and discovers:

Console.log (Selectedfile); Print as follows

Console.log (a); Print as follows

After observing that the file is loaded, the FileList object in the control is the load file information.

We can create a new FileReader object reader.

var reader = new FileReader ()

then call FileReader's Read method Readastext.

Reader.readastext (Selectedfile);

The corresponding operation functions are as follows:

function File_jquery (ID) {        var selectedfile = $ ("#" +id) [0].files[0];        var reader = new FileReader ();        Reader.readastext (selectedfile);        Console.log (reader);        Reader.onload = function () {                        Console.log ("Success");    }

After the file is loaded, the Web page executes as follows:

Reader.result is the result of reading after Readastext.

Additional information about FileReader is provided below for expansion:

FileReader a total of 4 reading methods:
1.readAsArrayBuffer (file): reads files as Arraybuffer.
2.readAsBinaryString (file): reads a file as a binary string
3.readAsDataURL (file): reads files as data URLs
4.readAsText (file, [encoding]): reads the file as text, encoding the default value is ' UTF-8 '
Additionally, the Abort () method can stop reading the file.

The FileReader object needs to be processed after it has read the file. To not block the current thread, the API uses the event model to register these events:
1.onabort: Triggered at interrupt time
2.onerror: Triggered when an error occurs
3.onload: Triggered when the file is successfully read
4.onloadend: Triggered when the file is read, regardless of failure
5.onloadstart: Triggered when a file starts reading
6.onprogress: Periodically triggers when a file is read

Note: In the event of reader, This.result and Reader.result are equivalent.

Reader.onload=function (f) {              var Result=document.getelementbyid ("result");              Display file              Result.innerhtml=this.result;          

2. Writing of external files

Reference method:

Http://www.china125.com/design/js/4085.htm

http://blog.csdn.net/ghlfllz/article/details/39346345

In the URL, the combination of encodeURIComponent uses special characters to pass character information:

Http://blog.sina.com.cn/s/blog_4586764e0100i4z3.html

HTML external file read/write