referenceError：<function>未定義

-1

我試圖創建一個簡單的費用跟蹤器頁面，使用非常少量的引導程序（對於我的按鈕）。但是當我按下按鈕來添加一個新的行到我的表，我在控制檯中出現以下錯誤。我有我的js文件中的功能，但無論我做什麼，我都無法弄清楚什麼是錯的。 HTML：referenceError：<function>未定義

<!DOCTYPE html> 
<html> 
<script type="text/javascript" src="expenses.js"></script> 
    <head> 
    <meta charset = "utf-8" /> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap /3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <title>Expenses</title> 
</head> 
<body> 
<div class="dataEntry"> 
    <input type="date" id="inputdate" name = "date" value=""></input> 
    <input type="text" id = "inputstore" name = "store" value="Store"></input> 
    <input type="text" id = "inputcategory" name = "category" value="Category"> </input> 
    <input type="text" id = "inputitem" name = "item" value="Item"></input> 
    <input type="text" id = "inputamount" name = "amount" value="Amount"></input> 
    <button type="button" class="btn btn-primary" name="button" \ 
     onclick="newExpense(inputdate,inputstore,inputcategory,inputitem,inputamount)"> Enter</button> 

    <table id="dataTable"> 
    <tr> 
     <th>Date</th> 
     <th>Store</th> 
     <th>Category</th> 
     <th>Item</th> 
     <th>Amount</th> 
    </tr> 
    </table> 
</div>

和Javascript：

"use strict" 
class Expense { 
    constructor(d,s,c,i,a){ 
    self.date = d; 
    self.store = s; 
    self.cat = c; 
    self.item = i; 
    self.amount = parseFloat(a); 
    } 

    buildTable() { 
    let row = table.createElement('tr'); 
    for (let cell of [self.date, self.store, self.cat, self.item,  self.amount]){ 
    let el = tr.createElement('td'); 
    row.appendChild(el); 
    } 
    } 
} 

class ExpenseDB { 
    constructor() { 
    this.array = []; 
    } 

    static newExpense(date, store, cat, item, amount) { 
    let expense = new Expense(date,store,cat,item,amount); 
    return expense; 
    } 
}

來源

2017-02-21 Allen

應該是'ExpenseDB.newExpense（...）'。無論如何，這隻會創建一個新的對象，什麼也不做。另外，你正在傳遞元素（通過全局ID（壞）） - 你需要元素的值！ – Li357

哪裏有全球ID？ 'let'聲明使得塊的所有變量都是局部的。 – Allen

'inputdate，inputstore，inputitem，inputamount'等 – Li357

我相信下面的應該解決這個問題：

"use strict" 
 
class Expense { 
 
    constructor(d,s,c,i,a){ 
 
    self.date = d; 
 
    self.store = s; 
 
    self.cat = c; 
 
    self.item = i; 
 
    self.amount = parseFloat(a); 
 
    } 
 

 
    buildTable() { 
 
    let row = document.createElement('tr'); 
 
    for (let cell of [self.date, self.store, self.cat, self.item,  self.amount]){ 
 
    let el = document.createElement('td'); 
 
    var t = document.createTextNode(cell); 
 
    el.appendChild(t); 
 
    row.appendChild(el); 
 
    } 
 
    return row; 
 
    } 
 
} 
 

 
class ExpenseDB { 
 
    constructor() { 
 
    this.array = []; 
 
    } 
 

 
    static newExpense(date, store, cat, item, amount) { 
 
    let expense = new Expense(date,store,cat,item,amount); 
 
    return expense; 
 
    } 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <meta charset = "utf-8" /> 
 
    <!-- <script type="text/javascript" src="expenses.js"></script> --> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap /3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    <script> 
 
     function createNewRow() { 
 
     let inputdate = document.getElementById('inputdate').value; 
 
     let inputstore = document.getElementById('inputstore').value; 
 
     let inputcategory = document.getElementById('inputcategory').value; 
 
     let inputitem = document.getElementById('inputitem').value; 
 
     let inputamount = document.getElementById('inputamount').value; 
 
     let expense = ExpenseDB.newExpense(inputdate,inputstore,inputcategory,inputitem,inputamount) 
 
     
 
     let table = document.getElementById('dataTable'); 
 
     table.appendChild(expense.buildTable()); 
 
     } 
 
    </script> 
 
    <title>Expenses</title> 
 
</head> 
 
<body> 
 
<div class="dataEntry"> 
 
    <input type="date" id="inputdate" name = "date" value=""></input> 
 
    <input type="text" id = "inputstore" name = "store" value="Store"></input> 
 
    <input type="text" id = "inputcategory" name = "category" value="Category"> </input> 
 
    <input type="text" id = "inputitem" name = "item" value="Item"></input> 
 
    <input type="text" id = "inputamount" name = "amount" value="Amount"></input> 
 
    <button type="button" class="btn btn-primary" name="button" \ 
 
     onclick="createNewRow();"> Enter</button> 
 

 
    <table id="dataTable"> 
 
    <tr> 
 
     <th>Date</th> 
 
     <th>Store</th> 
 
     <th>Category</th> 
 
     <th>Item</th> 
 
     <th>Amount</th> 
 
    </tr> 
 
    </table> 
 
</div> 
 
</body> 
 
</html>

來源

2017-02-21 04:38:42 uautkarsh

referenceError：<function>未定義

回答

相關問題