JavaScript代码将数据导出为CSV文件未能通过分隔数据“”

Question

背景信息

我试着写一些，将一些数据导出为CSV格式的JavaScript/HTML的逻辑，和在Excel中打开一个新文档或任何工作站上的默认csv应用程序。

问题

代码成功地创建一个新的CSV文件，并提示要保存文件，但是当它在Excel中显示，一切都在一列中，而不是被分成多个列。

代码：

function exportTableToCSV($tableName, fileName) { 
    var csv = GetCellValues($tableName); 
    console.log(csv); 
    console.log("filename is:" + fileName); 

    if (navigator.userAgent.search("Trident") >= 0) { 

    //this is the path that is execute in IE10 browser... 
    window.CsvExpFrame.document.open("text/html", "replace"); 
    window.CsvExpFrame.document.write(csv); 
    window.CsvExpFrame.document.close(); 
    window.CsvExpFrame.focus(); 
    window.CsvExpFrame.document.execCommand('SaveAs', true, fileName + ".csv"); 
    } else { 
    var uri = "data:text/csv;charset=utf-8," + escape(csv); 
    var downloadLink = document.createElement("a"); 
    downloadLink.href = uri; 
    downloadLink.download = fileName + ".csv"; 
    document.body.appendChild(downloadLink); 
    downloadLink.click(); 
    document.body.removeChild(downloadLink); 
    } 
}; 


function GetCellValues($table) { 
      var $rows = $table.find('tr:has(td),tr:has(th)'), 

      // Temporary delimiter characters unlikely to be typed by keyboard 
      // This is to avoid accidentally splitting the actual contents 
      tmpColDelim = String.fromCharCode(11), // vertical tab character 
      tmpRowDelim = String.fromCharCode(0), // null character 

      // actual delimiter characters for CSV format 
      colDelim = ',', 
      rowDelim = '"\r\n"', 

      // Grab text from table into CSV formatted string 
      csv = '"' + $rows.map(function(i, row) { 
       var $row = $(row), 
        $cols = $row.find('td, th'); 

       return $cols.map(function(j, col) { 
        var $col = $(col), 
         text = $col.text(); 

        return text.replace('"', '""'); // escape double quotes 

       }).get().join(tmpColDelim); 

      }).get().join(tmpRowDelim) 
      .split(tmpRowDelim).join(rowDelim) 
      .split(tmpColDelim).join(colDelim) + '"', 

      // Data URI 
      //csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv); 

    csvData = csv; 
    return csvData; 
}; 

CSV文件在Excel

代替具有数据的7列，我有与由它逗号分隔的所有7个值的数据的一列。

控制台输出上面的代码：

HTML1300: Navigation occurred. 
    group_membership_list.html 
    "Group Name","PD Number","Dest","Department","First Name","Last Name","ttp" 
    "Test Group","45721","test1@hotmail.com","undefined","Daniel","Pamplemouse","smtp" 
    "Test Group","45721","test1@hotmail.com","undefined","Daniel","Pamplemouse","smtp" 
    "Test Group","46481","test1@hotmail.com","undefined","Benjamin","Grouper","smtp" 
    "Test Group","48381","test1@hotmail.com","undefined","Gregory","Erock","smtp" 
    "Test Group","48381","test1@hotmail.com","undefined","Gregory","Erock","smtp" 
    "Test Group","48382","test1@hotmail.com","undefined","Jonathan","David","smtp" 
    "Test Group","48382","test1@hotmail.com","undefined","Jonathan","David","smtp" 
    "Test Group","45303","test1@hotmail.com","undefined","Harold","Cause","smtp" 
    "Test Group","45303","test1@hotmail.com","undefined","Harold","Cause","smtp" 
    "Test Group","45306","test1@hotmail.com","undefined","Micah","Latin","smtp" 
    filename is:Group Membership List.csv 

我试过到目前为止：

我试图改变这一点：

colDelim = ',', 

到 colDelim ='\，'，

但这并没有什么区别。 我确定这是一件很简单的事情，但我似乎无法看到我的错误。任何帮助，将不胜感激。

编辑1

我也尝试改变：

window.CsvExpFrame.document.write(csv); 

这样：

window.CsvExpFrame.document.write('sep=,\r\n' + csv); 

基于以下计算器问题： Javascript/ jQuery : Exporting data in CSV not working in IE

但它仍然是一个不行。

EDIT 2

作为一个测试，我把该Web应用程序创建的CSV文件的副本，并试图通过Excel中导入。我选择了逗号作为分隔符。最终的结果是它失败了 - 也就是说，所有数据都以一列结尾。
我想这意味着我在代码中创建分隔符的方式是错误的。 我更改我的代码以使用此：

colDelim = '","', 

并重试。当文件通过Web应用程序打开时，它仍然失败，但是如果我将该文件再次手动导入到Excel中，则此时它可以正常工作。

编辑3

这似乎是相关报价。正如你可以从控制台输出中看到的那样，每个字段似乎都被引号括起来，并用逗号分隔。但是，当我在Excel中检查数据时，第一个字段（Test Grp）实际上缺少引号。它看起来像这样：

Group Name,"PD Number","Dest","Department","First Name","Last Name","ttp" 
    Test Group,"45721","test1@hotmail.com","undefined","Daniel","Pamplemouse","smtp" 

EDIT 4

所以我改变了我的代码看起来像这样：

 // actual delimiter characters for CSV format 
     colDelim = '"\,"', 
     rowDelim = '"\r\n"', 

现在虽然IE仍然失败，其他的浏览器，如Chrome浏览器consistenly工作与这个组合。另外，虽然IE无法正常打开文件，但当我手动将网页生成的csv文件导入到Excel中时，它会正确解析。 另一个有趣的神器。 IE浏览器生成文件的名称是

Group Membership List_csv.csv 

，而Chrome的创建：

Group Membership List.csv 

Answer 1

我不能评论，所以我会张贴此作为一个答案：

在你GetCellValues功能您将您的rowDelimeter设置为“\ r \ n”。

我会尝试的第一件事就是将其更改为\ r \ n。我不能肯定地说，但双引号可能与Excel的导入CSV功能混淆。

rowDelim = '\r\n'; 

另外，当我创建一个类似的脚本来导入excel时，我只需要\ n返回，不需要包含\ r。如果更改rowDelim不起作用，您可能需要尝试。

编辑：

我发现我以前写的代码。下面是我所做的：

// Create the first row, title, for the CSV 
thecsv = "Full Title,CRN,Section,Class,Max,Actual,Open,Start,End,Day,Room\n"; 
// Split an array of info into comma-delimited values where each row is delimited by \n 
for(course in courses) { 
    for (detail in courses[course]) { 
     thecsv += courses[course][detail] + "," 
    } 
    thecsv += "\n"; 
} 
// Encode the CSV file. 
var encodedCSVURI = encodeURIComponent(thecsv); 
// Create a link to open the file (in my case, download) 
var link = document.createElement('a'); 
link.setAttribute("href", "data:attachment/csv," + encodedCSVURI) 
link.setAttribute("target", "_blank"); 
var filename = prompt("Please enter a name for the file.", "EXTRACTED_DATA"); 
link.setAttribute("download", filename + ".csv"); 
document.body.append(link); 
link.click(); 

编辑2：

这里我编码CSV字符串（这将是你甩表），创建下载编码的CSV字符串的文件的链接：

var encodedCSVURI = encodeURIComponent('some,comma,delimited,string\n,etc,etc,etc,etc'); // Encode the CSV 
link.setAttribute("href", "data:attachment/csv," + encodedCSVURI); // Create the download file link with the encoded CSV data 
link.setAttribute("download", "filename.csv"); // Here I was prompting the user for a filename, you don't have to 
link.setAttribute("target","_blank"); // This is to prevent leaving the current page. You don't have to include this 
document.body.append(link); // Add it to the document 
link.click(); // Click the link (download the file) 

Answer 2

不知道这是解决方案，但它是值得一试：

如果只使用发生选项（问题代码中的三叉戟条件），它可能是BOM前缀，在保存文件时可能丢失并且可能需要Excel。你可以把它添加到您的CSV文本：

window.CsvExpFrame.document.write("\uFEFF"+csv); 

然而，它可能也有相反的情况，是当文件被保存，然后不是用Excel预期BOM前缀加。在这种情况下，您可能需要使用像Notepad ++这样的文本编辑器将其删除，编码并保存没有BOM的文件。