使用html和ajax jquery在网页中显示本地存储的csv文件的代码不起作用

xxb16uws  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(212)

下面是代码的index.html。以下代码仅在按钮范围内显示在浏览器中。在那之后,它就没有按它应该的方式工作了。
它应该加载整个csv文件,该文件与index.html存储在同一文件夹中,并显示在网页中。我无法确定它的问题。我需要帮助。非常感谢。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container">
  <div class="table-responsive">
    <h1 align="center">CSV File to HTML Table</h1><br />
    <div align="center">
      <button type="button" name="load_data" id="load_data" class="btn btn-info">Load Data</button>
    </div><br />
    <div id="employee_table"></div>
  </div>
</div>
$(document).ready(function() {
  $('#load_data').click(function() {
    $.ajax({
      url: "FGExport - LEVI.csv",
      dataType: "text",
      success: function(data) {
        var employee_data = data.split(/\r?\n|\r/);
        var table_data = '<table class="table table-bordered table-striped">';
        for (var count = 0; count < employee_data.length; count++) {
          var cell_data = employee_data[count].split(",");
          table_data += '<tr>';
          for (var cell_count = 0; cell_count < cell_data.length; cell_count++) {
            if (count === 0) {
              table_data += '<th>' + cell_data[cell_count] + '</th>';
            } else {
              table_data += '<td>' + cell_data[cell_count] + '</td>';
            }
          }
          table_data += '</tr>';
        }
        table_data += '</table>';
        $('#employee_table').html(table_data);
      }
    });
  });
});

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题