javascript - select option remove() 方法删除多个选项

标签 javascript

我有一个包含 17 个值/选项的选择框。

<select id="_class" name="_class">
    <option value="0"></option>
    <option value="1">PREKG</option>
    <option value="2">LKG</option>
    <option value="3">UKG</option>
    <option value="4">I</option>
    <option value="5">II</option>
    <option value="6">III</option>
    <option value="7">IV</option>
    <option value="8">V</option>
    <option value="9">VI</option>
    <option value="10">VII</option>
    <option value="11">VIII</option>
    <option value="12">IX</option>
    <option value="13">X</option>
    <option value="14">XI</option>
    <option value="15">XII</option>
    <option value="16">XIII</option>                              
</select>

现在,我尝试将选项从 5 删除到 8。为此,我使用以下 JavaScript 代码。

<script type="text/javascript">
 var _class = document.getElementById("_class");
 for(var i=1; i < _class.length;i++) {
   if(i>=5 && i<=8) {
     _class.remove(i);
   }
 }
</script>

但是,我没有得到预期的结果,因为每次 for 循环运行时,选项的顺序都会发生变化。

怎样才能得到想要的结果?

Here我附上了 fiddle 。

最佳答案

通过递增地迭代选项,删除选项后的选项的索引将在选项被删除后立即减少一个(即:删除索引 5 处的选项导致选项 6 及以上现在是索引为选项 5 及以上)。

为了迎合这一点,反转循环的顺序以向下计数:

var _class = document.getElementById("_class");

for(var i=Math.min(_class.options.length, 8); i >= 5; i--) {
  _class.remove(i);
}

http://jsfiddle.net/Gy8j8/2/

关于javascript - select option remove() 方法删除多个选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14412354/

相关文章:

javascript - 自动复制隐藏文本

javascript - 获取 HTML 元素在主体坐标中的位置

javascript - 使用 Angular 中的 css 在 Safari 中为 'transform: scale()' 设置动画时出现不必要的延迟

javascript - 显示更多 jquery 以使用两个 div

javascript - 鼠标悬停时 html 元素的 CSS 选择器

javascript - 使用 JQuery 更改显示不起作用

javascript - 检测价格是否高于或低于 200.00,然后设置(此)表格行的样式

javascript - 如何将外部html添加到div中

javascript - "Redirect"到 FormData 对象

javascript - Protractor - 更改 css 属性以与元素交互