为什么我会得到一个意外的令牌

Why do I get a Unexpected Token?

本文关键字:一个 意外 令牌 为什么      更新时间:2023-09-26

我正在用一种javascript应用程序制作一个网站。我为此工作了很长时间,但最终一切都奏效了。因此,当我清理所有注释代码时,我刷新了我的网站并再次测试了此应用程序,但它不再起作用了。我得到的错误说:

未捕获的语法错误:意外的令牌 }

在第 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开发的初学者,所以我希望我能得到一个相对简单的解决方案和解释为什么会发生这种情况。谢谢你们。

将事件属性括起来:

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

函数不必以分号结尾:

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

函数表达式可以(避免副作用):

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

您也不需要 keyupchange 事件。

工作示例:https://jsfiddle.net/wtwx8vbj/

您可能应该将 onchange 和 onkeyup 属性括在引号中:

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

这个

<input onchange=calculator( "iron") >

是错误的,错误的 HTML 属性定义。如果属性值不是 NMTOKEN,则必须将其括在括号中,因此:

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

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