动态添加到选择框的选项不会删除

Question

我似乎不太清楚这一点。

我的函数按应有的方式工作，但是有一个差异，当从输入框中动态添加选项值时，我按[list1]中的Delete键，它们不会被删除。 但是，如果选项值是静态添加的，则它们会按预期删除。 有任何想法吗？

我真的很抓这个。

<!DOCTYPE html>

<html>

<head>
<script type="text/javascript">

function add_refdoc() {

    var x = document.getElementById("list1");

    var option = document.createElement("option");

    var input = document.getElementById('refdocs_input')

    option.text = input.value

    x.add(option,x.option)

    x.selectedIndex = x.options.length - 1;
}


function del_refdoc(e) {
    var evt = e ? e : event;
    var sel = evt.target ? evt.target : evt.srcElement;
    if(evt.keyCode && evt.keyCode == 46 || evt.which == 46) {
        var val = sel.value;
        var opts = sel.getElementsByTagName("option");
        if(val != "") {
            for(var i=0; i<opts.length; i++) {
                if(val == opts[i].value)
                    sel.removeChild(opts[i]);
                }
        }
    }
}

</script>


</head>

<body>
<input id="refdocs_input" type="text"/>

<input value="add" type="button" onclick="add_refdoc()"/>

<br>
<select onkeydown="del_refdoc(event)" style="width: 250px;" id="list1"></select>

<br><br>

<select onkeydown="del_refdoc(event)" style="width: 250px;" id="list2">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

</body>

</html>

Answer 1

看起来这就是添加选项值的方式

因此，我更改了此代码，它起作用了。

function add_refdoc() {

    var s = document.getElementById('list1')

    var t = document.getElementById('input1').value

    s.options[s.options.length] = new Option(t, t)

}

动态添加到选择框的选项不会删除

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-07-23 14:41:53

动态添加到选择框的选项不会删除

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-07-23 14:41:53

解决方案1
0 已采纳 2013-07-23 14:41:53