时间戳

首页 > 解决方案 > csv.html:24 Uncaught ReferenceError: [function] is not defined at HTMLButtonElement.onclick

javascript - csv.html:24 Uncaught ReferenceError: [function] is not defined at HTMLButtonElement.onclick

问题描述

我有这个错误；任何人都可以帮忙吗？：

csv.html:24 Uncaught ReferenceError: download_csv is not defined
at HTMLButtonElement.onclick

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="style.css">
  <title>CSV for Discogs</title>
  <style>
  td {
    max-width: 15vw;
    overflow: auto;
  }
  </style>
</head>
<body>
  <div>
    <input type="file" name="filename" id="fileInput">
    <div class="csv"></div>
    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha256-/SIrNqv8h6QGKDuNoLGA4iret+kyesCkHGzVUUV0shc=" crossorigin="anonymous"></script>
    <script src="csv.js"></script>
    <button onclick="download_csv()">Download CSV</button>
  </div>
</body>
</html>

JS（相关摘录）：

function download_csv() {
    var csv = 'Name,Title\n';
    data.forEach(function(row) {
            csv += row.join(',');
            csv += "\n";
    });
    console.log(csv);
    var hiddenElement = document.createElement('a');
    hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csv);
    hiddenElement.target = '_blank';
    hiddenElement.download = 'people.csv';
    hiddenElement.click();
}

我希望代码在按下按钮时输出一个 csv 文件。我正在使用 Atom 在 Windows 10 中编辑代码。

标签： javascript

解决方案

该错误告诉我们这download_csv在您的脚本中不是全局的。这是不使用onclick-attribute-style 事件处理程序的众多原因之一：它们调用的函数必须是全局函数。

任何一个：

  1. 使其成为全局（不是一个好主意，全局命名空间已经太拥挤了），或者

  2. 使用现代事件处理，也许通过给你button一个id然后使用document.getElementById("the-id").addEventListener("click", download_csv);来连接它。

推荐阅读