将onclick事件添加到动态选择下拉列表中的选项

时间:2016-03-08 14:27:57

标签: javascript

我有一个从JavaScript中的数组创建的下拉列表。当我更改下拉值时,我想对所选值执行某些操作。

var newArray = [3,5,4,6]

var container = document.getElementById('container')
var dropdown = creatSelectDropDown('thisDropdown', newArray)
container.appendChild(dropdown)

function creatSelectDropDown(id, array) {

    var dropdown = document.createElement("select");
    dropdown.id = id;

    for (var i = 0; i < array.length; i++) {
        var option = document.createElement("option");
        option.text = array[i];
        option.value =  array[i];
        dropdown.options.add(option);
    }


    return dropdown;
}

所以在上面的代码中我要么:

option.onclick = dosomething();

dropdown.onchange = dosomething(getvalueofoptiontag);

我显然在这里遗漏了一些简单的事情......

小提琴玩:https://jsfiddle.net/reko91/hnLxt4xh/1/

1 个答案:

答案 0 :(得分:2)

可以使用以下语法绑定要更改的函数:

dropdown.onchange = function(event) {
   console.log(event);
}

或使用eventListener:

dropdown.addEventListener("change", function(event) {
   console.log(event);
}, false);

你做错了是你必须将一个函数传递给onchange事件,例如:

var dosomething = function() { /* do something */}
dropdown.onchange = dosomething;