前端读取csv文件内容

最新推荐文章于 2025-07-13 11:13:08 发布

码大哈的园子

最新推荐文章于 2025-07-13 11:13:08 发布

阅读量1w

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_34075559/article/details/78830425

本文介绍了一种处理文件上传并解析CSV文件内容的方法，利用FileReader接口读取文件，并通过正则表达式检查文件内容的有效性。进一步将数据转换为JSON格式并加载到表格中显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var data = [];
var files = document.getElementById("index-info-file").files;
var reg = new RegExp(".*,\".*,.*\"$");
if(files.length) {
    var file = files[0];
    var reader = new FileReader();
    if(typeof FileReader == 'undefined') {
        layer.alert("你的浏览器不支持FileReader接口！", {title: "提示", skin: "layui-layer-molv"});
        return;
    }
    reader.readAsText(file);
    reader.onload = function(val) {
        var relArr = this.result.split("\r\n");
        if(!$.isEmptyObject(relArr) && relArr.length > 1) {
            for(var key = 1, len = relArr.length; key < len; key++) {
                var values = relArr[key];
                if(reg.test(values)) {
                    layer.alert("文件内容中有英文逗号，麻烦修改后再上传，含有英文逗号的内容是：" + values, {title: "提示", skin: "layui-layer-molv"});
                    return;
                }
                if(!$.isEmptyObject(values)) {
                    var obj = {};
                    var objArr = values.split(",");
                    obj["name"] = objArr[0];
                    obj["fieldName"] = objArr[1];
                    obj["targetStepName"] = objArr[2];
                    var originalStepName = objArr[3];
                    if (!$.isEmptyObject(originalStepName)){
                        originalStepName = originalStepName.replace(/，/g, ",");
                    }
                    obj["originalStepName"] = originalStepName;
                    obj["unitId"] = objArr[4];
                    obj["dataTypeId"] = objArr[5];
                    obj["dataFormatTypeId"] = objArr[6];
                    obj["priorityId"] = objArr[7];
                    obj["dataTimeId"] = objArr[8];
                    obj["description"] = objArr[9];
                    data.push(obj);
                }
            }
        }
        $("#index-expander-table").bootstrapTable("load", data);
        $("#upload-index-file").modal("hide");
    }
}