Question

我觉得提交另一个 Uncaught TypeError非常糟糕：undefined不是函数问题。但在阅读了这些类型问题的大约20个不同答案之后，要么我错过了重点，要么问题在这些情况下是不同的。

我有一个带有两个单选按钮的表单。单击一个时，我希望它更改<tr></tr>标记的innerHTML。

这是我的JFiddle。

HTML：

<form name="myForm" autocomplete="off" action="index.php" method="post" enctype="multipart/form-data">
<label for="mode">Text</label>
<input type="radio" name="mode" value="text" id="setText" />
<label for="mode">Image</label>
<input type="radio" name="mode" value="img" id="setImg" />
<table>
<tr id="headerInput"></tr>
</table>
</form>

Javascript：

document.getElementById("setText").addEventListener("click", function () {
window.getElementById("headerInput").innerHTML = '<td>Title</td><td><input type="text" name="title" value="Hello" /></td>';
});
document.getElementById("setImg").addEventListener("click", function () {
window.getElementById("headerInput").innerHTML = '<td>Banner</td><td><input type="file" name="banner" /></td>';
});

我尝试使用onclick="someFunction()"属性创建命名函数的几个不同版本，以及object.onclick。所有这些都给了我同样的错误。非常感谢你帮助我理解我在做什么。

Answer 1

window.getElementById()未在浏览器中正常定义。

在'getElementById'上查找属性window会返回undefined。然后你试图调用undefined，因此 Uncaught TypeError：undefined不是函数。

你可能意味着在那里使用document。

Answer 2

您应该引用document.getElementById（）而不是window.getElementById（）。另外，更改innerHTML很好，但是我们应该参考tr中的td来进行任何操作。这是最佳做法。

document.getElementById("headerInput").innerHTML

工作小提琴：http://jsfiddle.net/7fpBg/

未捕获的TypeError：undefined不是函数 - 不是JQuery

2 个答案: