Jquery 在具有标题的单元格中添加溢出表单元格

我似乎不知道该如何使用溢出的单元格处理表，并将这些单元格中的数据添加到另一个单元格中。我知道我的解释有点含糊不清，但请查看图片

最终输出应如下所示：

目前，我正在开发一个名为

jquerycsv

的jQuery库，并使用方法

csv.toArray（）

，该方法将数组作为输出。 从我的im开始，我一直在将我的

join（）

值添加到正确的位置。因此，在循环中，我检查它是否是数组的第4个元素，然后接下来的其余数据应该加入到单个字符串中，并添加到前一个单元格中。我的问题是，如何将已连接的字符串添加到其上一个单元格中？如果您能帮忙，我们将不胜感激

function generateTable(data) {
var html;
var overflow;
for(var row in data) {
    html += '<tr>\r\n';
    var myStr = [];
    var almost;
    for(var item in data[row]) {
        //html += '<td>' + data[row][item] + '</td>\r\n';
        if(data[row].indexOf(data[row][item]) < 4){
                html += '<td>' + data[row][item] + '</td>\r\n';
        }else{
                myStr.push(data[row][item]);
            console.log(myStr);
            almost = myStr.join(":");
                console.log(almost); 
        }

    }
    console.log("this : " + almost); //items all joined
    html += '</tr>\r\n';
}
return html;
}

函数生成表（数据）{
var-html；
var溢出；
for（数据中的var行）{
html+='\r\n'；
var myStr=[]；
var几乎；
对于（数据[行]中的var项）{
//html+=''+数据[行][项]+'\r\n'；
if（数据[行].indexOf（数据[行][项]）小于4）{
html+=''+数据[行][项]+'\r\n'；
}否则{
myStr.push（数据[行][项]）；
console.log（myStr）；
几乎=myStr.join（“：”）；
console.log（几乎）；
}
}
log（“this::+几乎）；//所有项目都已加入
html+='\r\n'；
}
返回html；
}

您可以尝试在下面的逻辑中为最后一列创建单独的文本并附加它

var input = $('#here').val();
var data = $.csv.toArrays(input);
function generateTable(data) {
var html;
var overflow;
for(var row in data) {
    html += '<tr>\r\n';
    var myStr = [];
    var almost;
    var lastCol = "<td>";
    var count=0;
    for(var item in data[row]) {
        //html += '<td>' + data[row][item] + '</td>\r\n';
        if(count < 3){
                html += '<td>' + data[row][item] + '</td>\r\n';
        }else{
            if(count>=4) {
              lastCol +=  ":";
            }
            lastCol +=  data[row][item];
        }
       count++;
    }
    lastCol += "</td>";
    console.log("this : " + almost); //items all joined
    html += lastCol + '</tr>\r\n';
}
return html;
}

$("#result").html(generateTable(data));

console.log(data);

var input=$（'#here'）.val（）；
变量数据=$.csv.toArray（输入）；
函数生成器（数据）{
var-html；
var溢出；
for（数据中的var行）{
html+='\r\n'；
var myStr=[]；
var几乎；
var lastCol=“”；
var计数=0；
对于（数据[行]中的var项）{
//html+=''+数据[行][项]+'\r\n'；
如果（计数<3）{
html+=''+数据[行][项]+'\r\n'；
}否则{
如果（计数>=4）{
lastCol+=“：”；
}
lastCol+=数据[行][项]；
}
计数++；
}
lastCol+=“”；
log（“this::+几乎）；//所有项目都已加入
html+=lastCol+'\r\n'；
}
返回html；
}
$（“#结果”）.html（生成表（数据））；
控制台日志（数据）；

---

您可以尝试下面的逻辑，您可以为最后一列创建单独的文本并附加它

var input = $('#here').val();
var data = $.csv.toArrays(input);
function generateTable(data) {
var html;
var overflow;
for(var row in data) {
    html += '<tr>\r\n';
    var myStr = [];
    var almost;
    var lastCol = "<td>";
    var count=0;
    for(var item in data[row]) {
        //html += '<td>' + data[row][item] + '</td>\r\n';
        if(count < 3){
                html += '<td>' + data[row][item] + '</td>\r\n';
        }else{
            if(count>=4) {
              lastCol +=  ":";
            }
            lastCol +=  data[row][item];
        }
       count++;
    }
    lastCol += "</td>";
    console.log("this : " + almost); //items all joined
    html += lastCol + '</tr>\r\n';
}
return html;
}

$("#result").html(generateTable(data));

console.log(data);

var input=$（'#here'）.val（）；
变量数据=$.csv.toArray（输入）；
函数生成器（数据）{
var-html；
var溢出；
for（数据中的var行）{
html+='\r\n'；
var myStr=[]；
var几乎；
var lastCol=“”；
var计数=0；
对于（数据[行]中的var项）{
//html+=''+数据[行][项]+'\r\n'；
如果（计数<3）{
html+=''+数据[行][项]+'\r\n'；
}否则{
如果（计数>=4）{
lastCol+=“：”；
}
lastCol+=数据[行][项]；
}
计数++；
}
lastCol+=“”；
log（“this::+几乎）；//所有项目都已加入
html+=lastCol+'\r\n'；
}
返回html；
}
$（“#结果”）.html（生成表（数据））；
控制台日志（数据）；

---

很高兴有人回答你。我会发展到只是为了练习，好吗

最后一个答案的关键是打印格式，所以我们需要做的就是调整它。例如，如果您想要一行带有标题，则应该循环并打印该行。像这样：

            // just adding a loop to headers:
            html += '<tr>\r\n';
            for(var item in header) {
                html += '<td>' + header[item] + '</td>\r\n';
            }
            html += '</tr>\r\n';

//只需向头添加一个循环：
html+='\r\n'；
用于（标题中的变量项）{
html+=''+标题[项目]+'\r\n'；
}
html+='\r\n'；

就这样。所有标题值将作为特定表格行上的表格单元格读取

第二步是从其他单元格中删除标题信息：

            for(var row in rows) {
                html += '<tr>\r\n';
                for(var item in rows[row]) {
                    html += '<td>' + rows[row][item].join(agregator) + '</td>\r\n';
                }
                html += '</tr>\r\n';
            }

for（行中的变量行）{
html+='\r\n'；
对于（行中的var项[行]）{
html+=''+行[行][项]。加入（agregator）+'\r\n'；
}
html+='\r\n'；
}

最后的代码，最后

var separator=“，”，
agregator=“：”；
函数生成器（行）{
if（typeof（lines）==“undefined”| | lines.length==0）{
返回“”；
}
var header=行[0]。拆分（分隔符）；
var html=''；
var行=[]；
//映射
用于（行中的var行）{
如果（行==0）{
继续；
}
var cols=行[行]。拆分（分隔符），
值={}；
for（以cols为单位的var col）{
变量项=标题[col]？标题[col]：标题[header.length-1]；
如果（值[项目]）{
值[item].push（cols[col]）；
}否则{
值[项目]=[cols[col]]；
}
}
行。推送（值）；
}
//印刷品
//只需向标题添加一个循环：
html+='\r\n'；
用于（标题中的变量项）{
html+=''+标题[项目]+'\r\n'；
}
html+='\r\n'；
for（行中的变量行）{
html+='\r\n'；
对于（行中的var项[行]）{
html+=''+行[行][项]。加入（agregator）+'\r\n'；
}
html+='\r\n'；
}
返回html；
}
$.ajax({
键入：“获取”，
url:“test.csv”，
数据类型：“文本”，
成功：功能（响应）{
$（'#result'）.html（generateTable（$.csv.parsers.splitLines（response））；
}
});

我在这里测试了您的JSFIDLE：只是更改了$.ajax部分。我想它会奏效的