我有以下几行js
var select_container = "container_"+parts[2];
var get_container = document.getElementById(select_container);
这是其中一部分的函数失败,当我查看 firebug 时,它返回未定义的 get_container。我已经检查过 select_container 是正确的值,并且页面上没有重复的 id。
这是由 onclick 事件调用的,因此我看不到等待页面加载是一个问题(无论我等待多长时间,结果都是一样的)。
相关的 html 示例:
<div id="container_0">
我很难过!
编辑
这是来自父函数的所有 Javascript
/*detects links in the form editor and uses them to adjust the layout*/
window.onload = function () {
clickDetection();
} /*detect clicks on interesting links*/
function clickDetection() {
var canvas = document.getElementById("content");
var dumbLinks = canvas.getElementsByTagName("a");
for (var i = 0; i < dumbLinks.length; i++) {
dumbLinks[i].onclick = function () {
clickRoute(this);
return false
};
}
} /*reroute click behaviour to correct function*/
function clickRoute(link_object) {
var linkId = link_object.getAttribute("id");
var linkParts = linkId.split("_");
if (linkParts[1] == "delete") {
delete_route(linkParts);
} else if (linkParts[1] == "new") {
new_route(linkParts);
}
}
function delete_route(parts) {
alert(parts);
if (parts[0] == "field") {
var select_container = "container_" + parts[2];
var get_container = document.getElementById(select_container);
document.removeChild(get_container);
} else if (parts[0] == "option") {
alert("delete a option");
}
}
完整的(典型的)html(请注意重复部分已被删减长度和其他细节更改为安全):
<!DOCTYPE HTML>
<html>
<head>
<!-- determines header content -->
<meta charset="utf-8" />
<meta name="description" content="Free Web tutorials" />
<meta name="keywords" content="HTML,CSS,XML,JavaScript" />
<script type="text/javascript" src="some.js"></script>
<title>Title of the document</title>
</head>
<body>
<div class="bignavblock"><p><a href="removed">nav link</a></p></div>
<div class="bignavblock"><p><a href="removed">nav linke</a></p></div>
<div class="bignavblock"><p><a href="removed">nav link</a></p></div>
<div class="bignavblock"><p><a href="removed">nav link</a></p></div>
<div class="bignavblock"><p><a href="removed">nav link</a></p></div>
<div class="bignavblock"><p><a href="removed">nav link</a></p></div>
<div id="content">
<h1>screen name</h1>
<form method="post" action="#this">
<label for="summary">Select an item to edit:<br></label>
<select name="summary" id="summary">
<option value="generic">generic</option>
<option value="updated">updated</option>
</select>
<input type="submit" name="summary_select" value="Select">
</form>
<h2>screen name</h2>
<div id="container_7">
<form method="post" action="#this">
<fieldset><legend>existing segment</legend>
<p><a id="field_delete_7" href="#">Delete field</a></p>
<label for="name_7">Field Name</label><input type=text id="name_7" name="name" value="Colour"><br>
<label for="type_7">Data type expected</label>
<select name="type" id="type_7">
<option value="name" >Name</option>
<option value="email" >Email Address</option>
<!-- cut for length -->
</select>
<p>Some text</p>
<label for="option_7_0">Option Value</label><input type=text id="option_7_0" name="option_7_0" value="Red">
<a id="option_delete_7_0" href="#">Delete option</a><br>
<label for="option_7_1">Option Value</label><input type=text id="option_7_1" name="option_7_1" value="Green">
<a id="option_delete_7_1" href="#">Delete option</a><br>
<label for="option_7_2">Option Value</label><input type=text id="option_7_2" name="option_7_2" value="Blue">
<a id="option_delete_7_2" href="#">Delete option</a><br>
<a id="option_new_7" href="#">Add new option</a>
<input type="submit" name="detail" value="Finish"></fieldset></form></div>
<p><a id="field_new" href="#">Add new field</a></p>
</div>
<!-- determines footer content -->
footer content
</body>
</html>
最佳答案
改变这个:
document.removeChild(get_container);
为此:
get_container.parentNode.removeChild(get_container);
或者如果容器是 body
的直接后代,那么您可以这样做:
document.body.removeChild(get_container);
关于javascript - Firebug 为一个 getElementById 返回奇怪的错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4950036/