1、前端读取文件的实现

关键：利用文件上传对话框预览本地文件、利用FileReader读取文件

• • 前端预览本地文件

• • 上传控件change事件利用FileReader读取文件

$('#select_range').change(function(evt){        var files = evt.target.files,            reader = new FileReader();            reader.onload = function(){                var range='XXXXXXXXXX';                         };        reader.readAsText(files[0]);    });

注意：FileReader需要HTML5的支持，另外可以通过设置或采用将上传空间调整为button样式

2、前端保存文件

• • HTML+JavaScript

保存

function fake_click(obj) {        var ev = document.createEvent("MouseEvents");        ev.initMouseEvent(            "click", true, false, window, 0, 0, 0, 0, 0            , false, false, false, false, 0, null        );        obj.dispatchEvent(ev);    }//name-文件名；data-要保存的字符串。function export_raw(name, data) {        var urlObject = window.URL || window.webkitURL || window;        var export_blob = new Blob([data]);        var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");        save_link.href = urlObject.createObjectURL(export_blob);        save_link.download = name;        fake_click(save_link);    }//点击按钮$('#aa').click(function() {    var data=“要保存的文本”；    export_raw('range.json', data);   };