Question

这很奇怪，我试图清除我的选择列表，正好有一半被清除，而不是一切。它也是留下的所有其他项目。我没有在这里包含数据，只是选择列表的设置。数据为10个项目，仅删除5个。 UniList调用DeleteAll。第一个警报打印出'10'，第二个打印输出'5'

DID只是document.getelementbyid（）

function DeleteAll(string) {

       var i;
       var list = DID(string);

       alert(DID(string).options.length);

       for (i = 0; i<list.options.length; i++) {
           list[i] = null;
       }
       alert(list.options.length);
       alert("finished deleting");
}

<select size='12' name='UniList' id='UniList' style='width:180px;' onclick=changeuni('UniList','Uni')>
    <option value=''></option>
    <option value=''></option>
    <option value=''></option>
</select>

Answer 1

list.options是HTMLOptionsCollection，假设为live：

注意： HTML DOM中的集合被认为是实时的，这意味着它们会在更改基础文档时自动更新。

因此，每次迭代都会删除一个项目并更新文档，以便list.options和list.options.length也更新。因此，不是删除列表中的第一个，第二个，第三个等选项，而是实际删除第一个，第三个，第五个等选项。

使用list.options[0]代替始终删除第一个选项：

while (list.options.length > 0) {
    list.options[0] = null;
}

或从后面删除选项：

for (i = list.options.length-1; i>=0; i--) {
    list.options[i] = null;
}

顺便说一句：HTMLSelectElement有一个remove method来删除索引的选项：

while (list.length > 0) {
    list.remove(0);
}

Answer 2

您只需用

替换现有的DeleteAll功能即可

function DeleteAll(listId) {
   var list = document.getElementById(listId);
   list.options.length=0;
}

甚至

function DeleteAll(listId) {
   document.getElementById(listId).options.length=0;
}

如果你仍然喜欢使用DID()，你可以在

中交换它

Answer 3

这也可能是一个选项

while ( list.options.length > 0 ) { list[0] = null; }

Answer 4

尝试从选择列表的末尾循环到开头。 UI怀疑你正在删除它，它正在重新排序数组，这样一旦你删除了下一个索引的一半，那么就超过了顶层。例如，如果您有10个项目，那么在删除5之后它将尝试删除索引为6的项目，但您只有列表长度为5，这样就无法工作......

所以基本上尝试：

   for (i = list.options.length-1 ; i>=0; i--) {
       list[i] = null;
   }

我想我的索引就在那里但是如果我弄错的话就相应地调整循环。

修改

我意识到还有一种更好的删除方式。只需使用list.options.length = 0将清除您的列表。我已经在jsFiddle中添加了一些示例，因此您可以看到它们的运行情况（因此我对它们的工作进行了测试）。

http://jsfiddle.net/HUvA2/3/ - 第一个按钮运行你的方法（你会看到它删除所有其他条目），第二个按钮运行我修改过的循环，你可以看到它完全摆脱它们。 “最佳”按钮只将列表长度设置为0.：）

HTML JS只有一半的选择列表被删除？

4 个答案: