2

我需要你的帮助，

我比较陌生javascript，需要专家/高级编码员的帮助。

您如何从选择框中删除突出显示/选定的值，因此一旦做出选择并按下键盘上的“删除”键，javascript就会运行一个函数并从selectbox.

这是我的html：

<!DOCTYPE html>    
<html>    
<head>    
</head>    
<body>
<select style="width: 250px;" id="list">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
</body>    
</html>
4

2 回答 2

3

您将事件处理程序附加到 onkeydown，检查删除键，获取当前值，找到具有该值的选项，然后删除该选项。http://jsfiddle.net/KgPBr/2/

$("#list").keydown(function(event) {
    if(event.which != 46) // not delete key
        return;
    var sel = $(this);
    var val = sel.val();
    if(val != "")
        sel.find("option[value="+val+"]").remove();
});

编辑这是纯 JavaScript 版本，它与所有浏览器的兼容性可能不如 jQuery 版本。http://jsfiddle.net/9cwyx/

document.getElementById("list").onkeydown = function(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]);
        }
    }
    }
};
于 2013-07-22T18:04:32.160 回答
-1

您可以使用以下代码执行此操作。我用过keydown事件监听器。

document.getElementById('list').addEventListener('keydown', deleteIt, false); 

function deleteIt(event) {
    if (event.which == 46) {  //keyCode of DEL is 46
        var e = document.getElementById("list");
        for (i = 0; i < e.length; i++) {
            e.remove(i);  //Used to delete the option
        }
    }
}

检查这个更新的 JSFiddle

于 2013-07-22T18:22:51.630 回答