Javascript 对象不是一个函数

Question

我收到以下错误，但找不到原因:

TypeError: object is not a function

这是我的 html:

<td><input type="text" value="" id="cash_retained" name="cash_retained" onkeyup="net_cash()" size="25"></td>
<td><input type="text" value="" id="cash_change" name="cash_change" onkeyup="net_cash()" size="25"></td>
<td><input type="text" value="0" id="net_cash" name="net_cash"></td>

这是我的 js 函数:

function net_cash() {
    var cash = 0;
    var retained = document.getElementById("cash_retained");
    var change = document.getElementById("cash_change");

    cash += parseInt(retained.value);
    cash += parseInt(change.value);

    if (isNaN(cash)) {
        document.getElementById("net_cash").value = "0";
    } else {
        document.getElementById("net_cash").value = cash;
    }
}

我终究无法理解为什么这行不通。我有其他类似的 js 函数，发现它很好。

Answer 1

这里的问题似乎是您有一个与您的函数同名的表单元素:

<td><input type="text" value="0" id="net_cash" name="net_cash"></td>

所以当你调用net_cash()在你的onkeyup事件，它认为你指的是这个 input DOM 对象而不是同名函数。我建议为这两件事分别起个名字。

内联事件处理程序具有封闭的 <form>元素作为它们的执行范围。每个表单控件都有一个 name属性被视为该范围内的变量，这就是冲突的来源。

这也是使用 unobtrusive JavaScript 的另一个重要原因。而不是内联事件处理程序。如果这样做，您就不必担心函数名称与元素名称冲突。参见 onclick=“” vs event handler有关使用内联事件处理程序的陷阱的更多信息。