未定義 Function 即使我在 Javascript 中定義了它

Question

我正在嘗試解決我在 NodeJs 和 Electron 中的分配問題，我在 Main.js 文件中有一個數據數組，並使用 IPC 方法將其檢索到 index.html 中。 每條數據記錄/行中還有一個按鈕，我想通過 onclick 屬性在此按鈕上設置一個 function 。 但是，當我單擊未定義 function 的按鈕時，這給了我錯誤。 我的代碼：

function myfun(){
    console.log("not working");
}
ipc.send("requestFileData");
ipc.on("responseFileData",(event,data)=>{

        // var htmldata = "";
        data.forEach(myFiles => {
            contentsTable.append(`
            <tr id="${myFiles.id}">
            <td>${myFiles.id}</td>
            <td>${myFiles.file_name}</td>
            <td><button id="${myFiles.id}" onclick="myfun()">Edit Image</button></td>
            </tr>
            `);
        });
});

當我單擊編輯圖像按鈕時，這給了我錯誤：

未捕獲的 ReferenceError：myfun 未在 HTMLButtonElement.onclick 中定義（index.html:1）

Answer 1

最后我找到了解決方案，我想分享一下：

ipc.on("responseFileData",(event,data)=>{

        contentsTable.html("");
        data.forEach(myFiles => {
            contentsTable.append(`
            <tr>
            <td>${myFiles.id}</td>
            <td class="fields">${myFiles.file_name}</td>
            <td><button class="clickedit" id="${myFiles.id}">Edit Image</button></td>
            </tr>
            `);
        });
        let editBtn = document.getElementsByClassName("clickedit");

        for(let i = 0; i < editBtn.length; i++) {
            editBtn[i].addEventListener("click", function() {
              var editId = editBtn[i].id;
              console.log(editId);
            });
          }
        });