爲什麼我會收到意外的令牌？

Question

我正在做一個JavaScript應用程序的網站。我在這方面工作很長，但最終都奏效了。所以，當我清理我所有的評論代碼時，我刷新了我的網站並再次測試了這個應用程序，但它不再工作。我得到的錯誤說：

未捕獲的SyntaxError：意外的標記}

下在這裏第13行是在錯誤發生。

<table class="calculator" id="calculator"> 
     <tr> 
      <th>Materiaal</th> 
      <th>Waarde(&euro;/kg)</th> 
      <th>Hoeveelheid(kg)</th> 
      <th>Subtotaal</th> 
     </tr> 
     <tr> 
      <td>IJzer</td> 
      <td>0,15</td> 
      <td> 
       <input type="number" min="0" id="ironinput" onchange=calculator("iron") onkeyup=calculator("iron") value=0> 
      </td> <!--This is where the error occurs--> 
      <td id="ironoutput">0.00</td> 
     </tr> 

這是我的javascript：

var materials = ["iron", "copper", "aluminum"]; 
 

 
var iron = 0.15; 
 
var copper = 4.00; 
 
var aluminum = 0.70; 
 

 
function calculator(material) { 
 
    var input = document.getElementById(material + "input").value; 
 

 
    switch (material) { 
 
     case "iron": 
 
      document.getElementById(material + "output").innerHTML = (input * iron).toFixed(2); 
 
      break; 
 
     case "copper": 
 
      document.getElementById(material + "output").innerHTML = (input * copper).toFixed(2); 
 
      break; 
 
     case "aluminum": 
 
      document.getElementById(material + "output").innerHTML = (input * aluminum).toFixed(2); 
 
      break; 
 
    } 
 
    document.getElementById("total").innerHTML = getTotal().toFixed(2); 
 
}; 
 

 
function getTotal() { 
 
    var total = 0; 
 
    for (var i = 0; i < materials.length; i++) { 
 
     total += Number(document.getElementById(materials[i] + "output").innerHTML); 
 
    } 
 
    return total; 
 
};

我希望有人能幫助我，我在Web開發初學者，所以我希望我能得到一個relativily簡單的解決方案並解釋爲什麼會發生這種情況。感謝你們。

Answer 1

附上您的事件屬性：

<input type="number" min="0" id="ironinput" onchange="calculator('iron');" onkeyup="calculator('iron');" value="0" /> 

功能沒有與結束分號：

function foo() { 
    console.log('foo'); 
} 

函數表達式do（避免副作用）：

var foo = function() { 
    console.log('foo'); 
}; 

你也不需要兩個keyup和change事件。

工作例如：https://jsfiddle.net/wtwx8vbj/

Answer 2

你或許應該附上平變化和行情的onkeyup屬性：

<input type="number" min="0" id="ironinput" onchange="calculator('iron')" onkeyup="calculator('iron')" value="0" /> 

Answer 3

這

<input onchange=calculator("iron") > 

是錯誤的，不好的HTML屬性定義。屬性值必須用括號括起來，如果它不是一個NMTOKEN，所以：

<input onchange='calculator("iron")' > 

檢查https://html.spec.whatwg.org/multipage/syntax.html#syntax-attributes