用JavaScript读取本地文件内容

随着JavaScript应用面的逐渐广泛。我们的js的要求也愈来愈高，现在我们可以用js做后端服务器（Node.js），做前端游戏模拟器（JS GameBoy Color Game Center），甚至有人用他模拟了一台pc，并且装上了linux（jslinux）在浏览器里跑。js总是给我们带来一个又一个惊喜。

随着HTML5的流行和逐渐普及，无数的好的接口也一个个的向我们走来，惊喜不断，以前一直被视为无法实现的js读取本地文件内容在现在也已经不再是什么难事了。你唯一需要关注的可能就是浏览器兼容性问题了。

今天要介绍的是使用js读取本地文件内容：

我们完全依赖FileReader类完成读取工作，你可以到w3c的网站查看相关的说明http://www.w3.org/TR/FileAPI/

然后我们需要使用到html的input标签的file类型元素

multiple=””用于设置控件为多选

下面是读取文件的代码

function read_files(fileArray){
    for(var i in fileArray){
        var file = fileArray[i]; //这个file对象有以下属性可供读取name、size、lastModifiedDate和type等。
        var reader = new FileReader();
        if(/text\/\w+/.test(file.type)) { //判断文本文件
            reader.onload = function() { //读取结束后触发onload事件
                $('
'+this.result+'
').appendTo('body');
            }
            reader.readAsText(file);//readAsText函数用于将文件读取为文本
        }else if(/image\/\w+/.test(file.type)) { //判断图片文件
            reader.onload = function() {
                $('
').appendTo('body');
            }
            reader.readAsDataURL(file);//readAsDataUrl函数用于将文件读取为Data url
        }
    }

}

下面介绍一下FileReader对象：
他采用事件机制，以下为他的的一些可以注册的事件：
onabort：中断时触发
onerror：出错时触发
onload：文件成功读取完毕时触发
onloadend：文件读取完毕时触发，无论是否失败
onloadstart：文件开始读取时触发
onprogress：当文件读取时，周期性地触发

他有4个读取函数：
readAsArrayBuffer(file)：将文件读取为ArrayBuffer。
readAsBinaryString(file)：将文件读取为二进制字符串
readAsDataURL(file)：将文件读取为Data URL
readAsText(file, [encoding])：将文件读取为文本，encoding缺省值为’UTF-8′

另外：
他的abort()方法可以停止读取文件