点击导出所选数据(原生js)

简介: 点击导出所选数据(原生js)

这里采用的是a标签的形式导出的(比较方便)

//设置变量和数组来进行所选数据的导出
//想要导出的总数据(接口返回的数据)
let datas;
//想要导出的部分数据
let arr_arr = [];
//点击事件
function elext() {
//初始化一下数组
    arr_arr = []
//将所选的数据push到数组里面
    for (let i = 0; i < $('.radio').length; i++) {
        if ($('.radio').eq(i).prop('checked') == true) {
            arr_arr.push(dat[i])
        }
    }
    console.log(arr_arr);
//判断有没有东西,没有的话导出全部数据,有就导出选择的数据
    if (arr_arr.length == 0) {
        //定义表头
        let str =
            '多选ID,序号,工资日期,员工姓名,公共性质,职务,薪水等级,岗位标准工资,安全标准工资,岗位标准津贴,绩效奖金,应出勤天数,实际出勤天数,岗位工资,安全质量奖金,岗位津贴,绩效奖金,证书补贴,通讯补贴,电脑补贴,夜班补贴,加班补贴,误餐补贴,租房补贴,高温补贴,取暖补贴,外出施工补贴,奖金,其他补助,扣款,应发小计,个人社保,个税,实发小计,单位社保,管理费,合计金额,电话,身份证号,银行卡,项目id,项目名称,操作\n';
        //增加\t为了不让表格显示科学计数法或者其他格式
        for (let i = 0; i < datas.length; i++) {
            for (let item in datas[i]) {
                str += `${datas[i][item] + '\t'},`;
            }
            str += '\n';
        }
        //encodeURIComponent解决中文乱码
        let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
        //通过创建a标签实现
        let link = document.createElement("a");
        link.href = uri;
        //对下载的文件命名
        link.download = "工资报表.csv";
        link.click();
    } else {
//删除所不需要的数据
        for (let i = 0; i < arr_arr.length; i++) {
            delete arr_arr[i].grade_fixed;
            delete arr_arr[i].bz_wages_fixed;
        }
        //定义表头
        let str =
            '多选ID,序号,工资日期,员工姓名,公共性质,职务,薪水等级,岗位标准工资,安全标准工资,岗位标准津贴,绩效奖金,应出勤天数,实际出勤天数,岗位工资,安全质量奖金,岗位津贴,绩效奖金,证书补贴,通讯补贴,电脑补贴,夜班补贴,加班补贴,误餐补贴,租房补贴,高温补贴,取暖补贴,外出施工补贴,奖金,其他补助,扣款,应发小计,个人社保,个税,实发小计,单位社保,管理费,合计金额,电话,身份证号,银行卡,项目id,项目名称,\n';
        //增加\t为了不让表格显示科学计数法或者其他格式
        for (let i = 0; i < arr_arr.length; i++) {
            for (let item in arr_arr[i]) {
                str += `${arr_arr[i][item] + '\t'},`;
            }
            str += '\n';
        }
        //encodeURIComponent解决中文乱码
        let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
        //通过创建a标签实现
        let link = document.createElement("a");
        link.href = uri;
        //对下载的文件命名
        link.download = "工资报表.csv";
        link.click();
    }
}
相关文章
|
7月前
|
Web App开发 数据采集 JavaScript
动态网页爬取:Python如何获取JS加载的数据?
动态网页爬取:Python如何获取JS加载的数据?
1200 58
|
9月前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
用array.filter()来实现数据筛选、数据清洗和链式调用,相对于for循环更加清晰,语义化强,能显著提升代码的可读性和可维护性。博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
11月前
|
JavaScript 前端开发 测试技术
盘点原生JavaScript中直接触发事件的方式
本文全面探讨了原生JavaScript中触发事件的多种方式,包括`dispatchEvent`、`Event`构造函数、`CustomEvent`构造器、直接调用事件处理器以及过时的`createEvent`和`initEvent`方法。通过技术案例分析,如模拟点击事件、派发自定义数据加载事件和实现提示框系统,帮助开发者掌握这些方法在实际开发中的应用,提升灵活性与兼容性。
408 3
|
监控 JavaScript 算法
深度剖析 Vue.js 响应式原理:从数据劫持到视图更新的全流程详解
本文深入解析Vue.js的响应式机制,从数据劫持到视图更新的全过程,详细讲解了其实现原理和运作流程。
|
数据采集 存储 监控
实现自动化数据抓取:使用Node.js操控鼠标点击与位置坐标
本文介绍了如何使用Node.js和Puppeteer实现自动化数据抓取,特别是针对新闻网站“澎湃新闻”。通过设置代理IP、User-Agent和Cookie,提高爬虫的效率和隐蔽性,避免被网站封锁。代码示例展示了如何模拟鼠标点击、键盘输入等操作,抓取并整理新闻数据,适用于需要规避IP限制和突破频率限制的场景。
562 10
|
数据采集 存储 JavaScript
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
本文介绍了如何使用Puppeteer和Node.js爬取大学招生数据,并通过代理IP提升爬取的稳定性和效率。Puppeteer作为一个强大的Node.js库,能够模拟真实浏览器访问,支持JavaScript渲染,适合复杂的爬取任务。文章详细讲解了安装Puppeteer、配置代理IP、实现爬虫代码的步骤,并提供了代码示例。此外,还给出了注意事项和优化建议,帮助读者高效地抓取和分析招生数据。
499 0
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
|
前端开发 JavaScript
JS-数据筛选
JS-数据筛选
133 7
|
JavaScript 数据安全/隐私保护
2024了,你会使用原生js批量获取表单数据吗
2024了,你会使用原生js批量获取表单数据吗
241 4
|
机器学习/深度学习 JSON JavaScript
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
444 0
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)