定位标记下载属性不起作用：Chrome 35.0.1916.114中的错误
我正在尝试引用这个代码 ，我们正在下载一个CSV文件点击一个链接。
$(document).ready(function () { function exportTableToCSV($table, filename) { var $rows = $table.find('tr:has(td)'), // 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'); 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); $(this) .attr({ 'download': filename, 'href': csvData, 'target': '_blank' }); } // This must be a hyperlink $(".export").on('click', function (event) { // CSV exportTableToCSV.apply(this, [$('#dvData>table'), 'export.csv']); // IF CSV, don't do event.preventDefault() or return false // We actually need this to be a typical hyperlink }); }); 但不知何故，下载的文件在Chrome v35.0.1916.114中被命名为download无扩展名，一种解决方法是将数据：application / csv更改为data：text / csv，但这只有助于在下载的文件中获得扩展名即现在下载为download.csv 。
下载属性的问题仍然存在。 我想命名我的文件为export.csv ，但它仍然给我download.csv 。
所以你应该改变这个：
// Data URI csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv); $(this) .attr({ 'download': filename, 'href': csvData, 'target': '_blank' });
对此
// Data URI //csvData = 'data:text/csv;charset=utf-8,' + encodeURIComponent(csv), //old way blob = new Blob([csv], { type: 'text/csv' }); //new way var csvUrl = URL.createObjectURL(blob); $(this) .attr({ 'download': filename, 'href': csvUrl });
它应该工作！
这是在问题＃377860中报告的Chrome 35中的一个错误。
更新：此错误已并入问题＃373182 。 你可以点击这个星标来告诉开发者你认为这个问题应该得到修正，并且也会得到变化的通知。
通常情况下，铬团队每两周发布一次更新，所以您可以很快得到解决，因为这被标记为Pri-1 ，我认为这意味着最高优先级。
对我而言：
var content = "some content"; var link = document.createElement('a'); var blob = new Blob(["\ufeff", content]); var url = URL.createObjectURL(blob); link.href = url; link.setAttribute('download', 'file.csv'); link.click();
这有点为我工作（在Chrome和Firefox）。 我从一个表中构build一个xls文件。
function downloadInnerHtml(filename,elId,mimeType){ var elHtml='<table border="1">'+document.getElementById(elId).innerHTML+'</table>'; var link=document.createElement('a'); mimeType=mimeType || 'application/xls'; var blob=new Blob([elHtml],{type:mimeType}); var url=URL.createObjectURL(blob); link.href=url; link.setAttribute('download', filename); link.innerHTML = "Export to CSV"; document.body.appendChild(link); link.click(); } $(document).on("click","#exportButton",function(){ var date=new Date(); var mm=date.getMonth()+1; var dd=date.getDate(); var yy=date.getFullYear(); var timeStamp=yy+""+((mm<10)?"0"+mm:mm)+""+((dd<10)?"0"+dd:dd); var fileName=timeStamp+'_Employees.xls'; downloadInnerHtml(fileName,'mainEmployeeTable','application/xls'); });
希望能帮助别人…
–Charles
当我尝试这个代码时，我无法在IE中获得结果，而且这个代码只能遍历td ，它会跳过表中的任何一个。 我修改了代码来解决我遇到的两个问题：
$(document).ready(function () { function exportTableToCSV($table, filename) { var $rows = $table.find('tr'), tmpColDelim = String.fromCharCode(11), tmpHeadDelim = String.fromCharCode(11), tmpRowDelim = String.fromCharCode(0), colDelim = '","', headDelim = '","', rowDelim = '"\r\n"', csv = '"' + $rows.map(function (i, row) { var $row = $(row), $cols = $row.find('td'); $heads = $row.find('th'); var c = $heads.map(function (k, head) { var $head = $(head), text = $head.text(); return text.replace(/"/g, '""'); }).get().join(tmpHeadDelim); var d = $cols.map(function (j, col) { var $col = $(col), text = $col.text(); return text.replace(/"/g, '""'); }).get().join(tmpColDelim); return (c+d); }).get().join(tmpRowDelim) .split(tmpRowDelim).join(rowDelim) .split(tmpHeadDelim).join(headDelim) .split(tmpColDelim).join(colDelim) + '"'; var ua = window.navigator.userAgent; var msie = ua.indexOf("MSIE "); // if Internet Explorer (10+) if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) { var blob = new Blob([decodeURIComponent(csv)], { type: 'text/csv;charset=utf8' }); window.navigator.msSaveBlob(blob, filename); } else { var link = document.createElement('a'); var blob = new Blob([csv],{type:'text/csv;charset=utf8'}); var url = URL.createObjectURL(blob); link.href = url; link.setAttribute('download', filename); document.body.appendChild(link); link.click(); } } $("#fnExcelReport").on('click', function (event) { var args = [$('#tableContent'), 'Report.csv']; exportTableToCSV.apply(this, args); }); });
CodePen
附加锚标签使用string添加标签信息的string，然后追加，它适用于我的谷歌浏览器
