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的支持，另外可以通过设置或采用filestyle将上传空间调整为button样式
2、前端保存文件
- HTML+JavaScript
<a href="javascript:void(0)" id="aa">保存</a>
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); ??};js前端读写文件的方法（json、excel）
原文地址：https://www.cnblogs.com/qq735675958/p/8627716.html