1

找到了一个使用 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(/[\r\n|\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);
4

2 回答 2

0

不，没有办法做到这一点。您每次都必须手动选择本地文件。如果它不能那样工作，每个站点都可以在未经您许可的情况下访问您的文件。

于 2014-01-27T11:30:34.737 回答
0

实际上，从外部 URL 请求文本文件并不少见。事实上，它早于 File API。听说过流行语“AJAX”吗？

以适当的跨浏览器方式执行异步请求只是稍微复杂一点，因此除了其他功能之外，还有许多库包含简单的方法来执行此操作。JQuery，通常由“$”符号识别，就是一个例子，但您可以通过谷歌搜索“AJAX 库”来搜索自己的。

$.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;
    }
}
于 2013-06-21T19:22:36.000 回答