js前端读写文件的方法(json、excel)

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);

};

原文地址:https://www.cnblogs.com/qq735675958/p/8627716.html

时间: 2025-01-14 14:07:27

js前端读写文件的方法(json、excel)的相关文章

RandomAccessFileDemo1~2 读写文件的方法

RandomAccessFileDemo1 写文件的方法 /** *    文件操作 --- RandomAccessFile *    Java提供了一个可以对文件随机访问的操作,访问包括读和写操作.基于指针形式读写文件数据. *    该类名为RandomAccessFile.该类的读写是基于指针的操作. RandomAccessFile支持两种创建模式 只读模式:仅对文件数据进行读取工作 读写模式:对文件数据读写操作 常用构造方法 RandomAccessFile(File file,St

转:Java读写文件各种方法及性能比较

干Java这么久,一直在做WEB相关的项目,一些基础类差不多都已经忘记.经常想得捡起,但总是因为一些原因,不能如愿. 其实不是没有时间,只是有些时候疲于总结,今得空,下定决心将丢掉的都给捡起来. 文件读写是一个在项目中经常遇到的工作,有些时候是因为维护,有些时候是新功能开发.我们的任务总是很重,工作节奏很快,快到我们不能停下脚步去总结. 文件读写有以下几种常用的方法 1.字节读写(InputStream/OutputStream) 2.字符读取(FileReader/FileWriter) 3.

Python遍历文件夹和读写文件的方法

本文和大家分享的主要是python开发中遍历文件夹和读写文件的相关内容,一起来看看吧,希望对大家学习和使用这部分内容有所帮助. 需 求 分 析 1.读取指定目录下的所有文件 2.读取指定文件,输出文件内容 3.创建一个文件并保存到指定目录 实 现 过 程 Python写代码简洁高效,实现以上功能仅用了40行左右的代码~ 昨天用Java写了一个写入.创建.复制.重命名文件要将近60行代码: 不过简洁的代价是牺牲了一点点运行速度,但随着硬件性能的提升,运行速度的差异会越来越小,直到人类无法察觉~ #

Meteor node.js 复制(copy)文件的方法

以下三种方法中请注意加: var exec = Npm.require('child_process').exec; var fs =Npm.require('fs'); 1.  原文件在private目录下,用Meteor 的Assets读取内容,使用node.js的fs.writeFile()写入,这种方法只能适用文本文件 var copyFile=function(){ //检测目标文件是否存在 fs.open( FILE_STORE_AB_PATH+"/aapt",'r',fu

Maven项目WEB-INF/views无法引入js,css静态文件解决方法

web.xml针对文件后缀配置以下,对客户端请求的静态资源如图片.JS文件等的请求交由默认的servlet进行处理 <servlet-mapping> <servlet-name>default</servlet-name> <url-pattern>*.css</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>default<

python学习笔记5:python读写文件

python学习笔记5:python读写文件 一.文件的打开模式 1.打开文件 1) f=open('D:\\a.txt','w') 第一个参数是文件的路径,如果只写文件的名字,默认是在当前执行目录下的文件:第二个参数是文件的打开模式 这种方式打开文件,在使用完了之后一定要记得,关闭文件: f.close() 2) with open('D:\\a.txt','w') as f 这种方式打开文件,文件在使用完后会自动关闭文件,不需要close  2. 文件的打开模式 总的来说,文件的打开模式有三

在android中读写文件

在android中读写文件 android中只有一个盘,正斜杠/代表根目录. 我们常见的SDK的位置为:/mnt/sdcard 两种最常见的数据存储方式: 一.内存 二.本地 1.手机内部存储 2.外部存储设备(SD卡) 在SD卡中读数据是不需要权限的,但是在SD卡中写数据是要权限的: <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> 读写文件的方式就是用的Java的文件

js操作XML文件兼容IE与FireFox

最近项目中用到了xml,需求是用户安装产品时先把一系列的数据保存到xml文件中,当执行到最后一步时才写入数据库,这样最大限度的减少了数据库的访问,于是不得不纠结在各浏览器的兼容性的问题(悲哀啊....) 进入正文 下面是一个xml文件 (createInstal.xml) <?xml version="1.0" encoding="utf-8"?><info><Item><id descrption="级别&quo

C# 中 NPOI 库读写 Excel 文件的方法【摘】

原作:淡水网志 NPOI 是开源的 POI 项目的.NET版,可以用来读写Excel,Word,PPT文件.在处理Excel文件上,NPOI 可以同时兼容 xls 和 xlsx.官网提供了一份 Examples,给出了很多应用场景的例子,打包好的二进制文件类库,也仅有几MB,使用非常方便. 读Excel NPOI使用HSSFWorkbook类来处理xls,XSSFWorkbook类来处理xlsx,它们都继承接口IWorkbook,因此可以通过IWorkbook来统一处理xls和xlsx格式的文件