找到了一个使用HTML5文件api解析csv文件并非常漂亮地显示输出的很好的演示。
http://rohitrox.github.io/js_csv/如果我不想从本地系统加载文件,但有一个静态文件要输入,例如test.csv,该怎么办?我知道这是一个安全问题,但有什么解决办法吗?
function handleFileSelect(){
var file = document.getElementById("the_file").files[0];
var reader = new FileReader();
var link_reg = /(http://|https://)/i;
reader.onload = function(file) {
var content = file.target.result;
var rows = file.target.result.split(/[rn|n]+/);
var table = document.createElement('table');
for (var i = 0; i < rows.length; i++){
var tr = document.createElement('tr');
var arr = rows[i].split(',');
for (var j = 0; j < arr.length; j++){
if (i==0)
var td = document.createElement('th');
else
var td = document.createElement('td');
if( link_reg.test(arr[j]) ){
var a = document.createElement('a');
a.href = arr[j];
a.target = "_blank";
a.innerHTML = arr[j];
td.appendChild(a);
}else{
td.innerHTML = arr[j];
}
tr.appendChild(td);
}
table.appendChild(tr);
}
document.getElementById('list').appendChild(table);
};
reader.readAsText(file);
}
document.getElementById('the_form').addEventListener('submit', handleFileSelect, false);
document.getElementById('the_file').addEventListener('change', fileInfo, false);
实际上,从外部URL请求文本文件并不罕见;事实上,它早于File API。听说过"AJAX"这个流行词吗?
异步请求只是稍微复杂一点,以适当的跨浏览器方式完成,所以有许多库,在其他功能中,包含简单的方法来完成它。JQuery就是一个例子,通常用"$"符号来识别,但你也可以通过谷歌搜索"AJAX库"来搜索你自己的JQuery。
$.ajax({
url: 'files/file.csv', // this will automatically be seen as a relative URL
//to the page you've navigated to, ie "http://www.google.com/files/file.csv"
success: function(data) {
// This function won't execute right away, but when the server's
// text response comes back.
// "data" will be a string containing the text of the response.
document.getElementById("csvOutputDisplay").textContent = data;
}
}
No。这是不可能的。每次都需要手动选择本地文件。如果不这样的话,任何网站都可以在没有你允许的情况下访问你的文件。