JavaScript Removechild数组
-
24-10-2019 - |
题
这看起来很简单,但我只是无法正常工作。我可以添加DOM元素,但是在使用数组时我无法将它们删除。
<script language="javascript">
fields = 0;
count = 0;
function addInput() {
if (fields != 10) {
var htmlText = "<input type='search' value='' name='field[]' />";
var remButton = "<input type='button' value='del' onclick='remove()' />";
var newElement = document.createElement('div');
newElement.id = 'SomeID'+fields;
newElement.innerHTML = htmlText + remButton + newElement.id;
var fieldsArea = document.getElementById('text');
fieldsArea.appendChild(newElement);
fields += 1;
} else {
...
}
count++;
}
// NEED HELP FROM HERE PLEASE
// You don't need to Loop, just get the button's id and remove that entire 'SomeID'
function remove() {
fieldsArea = document.getElementById('text');
fieldsArea.removeChild(SomeID1); <-----------------------THIS WORKS!
fieldsArea.removeChild(SomeID+count); <------------------THIS JUST WOULDN'T
count--;
}
</script>
在删除函数中,编写SomeID1可以工作并删除第一个添加的元素,但是当我尝试使用“计数”时,我只是无法删除“元素”。
非常感激任何的帮助。
谢谢!
解决方案
您必须先获得对元素的引用。目前,您正在传递一个未定义的变量 SomeID
到功能。
例如:
var element = document.getElementById('SomeID' + fields);
// or starting by zero: var element = document.getElementById('SomeID0');
element.parentNode.removeChild(element);
如果要删除 div
单击按钮,您必须传达对相应的 div
到 remove
功能。
'<input type="button" value="del" onclick="remove(this.parentNode)" />';
this
将参考按钮,因为它是 div
, this.parentNode
指的是 div
.
您还必须更改功能才能接受应删除的元素:
function remove(element) {
element.parentNode.removeChild(element);
count--;
}
您可能还必须更新 fields
, ,但我不确定您的代码应该如何工作。
如果要删除所有这些,则必须循环:
for(;fields--;) {
var element = document.getElementById('SomeID' + fields);
element.parentNode.removeChild(element);
}
也看看 文档 removeChild
.
其他提示
这 removeChild
需要一个节点(DOM元素)作为参数。在这种情况下
fieldsArea.removeChild(SomeID+count);
例如,您可以通过这种方式传递节点
fieldsArea.removeChild(document.getElementById('SomeID'+count));
不隶属于 StackOverflow