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

时间:2016-02-29 20:23:50

标签: javascript html web

我正在制作一个带有某种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:

&#13;
&#13;
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;
};
&#13;
&#13;
&#13;

我希望有人可以帮助我,我是网络开发的初学者,所以我希望我能得到一个相对简单的解决方案并解释为什么会这样。谢谢你们。

3 个答案:

答案 0 :(得分:0)

您可能应该在引号中包含onchange和onkeyup属性:

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

答案 1 :(得分:0)

这个

<input onchange=calculator( "iron") >

错误,HTML属性定义错误。如果属性值不是NMTOKEN,则必须用括号括起来,所以:

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

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

答案 2 :(得分:0)

附上您的活动属性:

<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/