的JavaScript/DOM对象选择电平变化的函数调用不工作，但内嵌HTML确实

Question

所以我用火力来设计一个网站，并调用数据库中的数据来填充选择功能..

我有了一个js文件很多firebase的东西，比如在html/DOM完全加载之后发生的认证，一些声明的函数在底部。

当建立这个下拉菜单中，我从数据库中检索项目来填充它，然后做这行的代码 -

dropDown.setAttribute("onchange", changeTable()); 

添加就可以了平变化监听器，在我的代码，当的onclick被触发/选择项值改变时，它根据选择的内容重新填充来自数据库的项目的表格。

问题是，这个函数被调用一次，然后不会再次触发。它上面，我有工作原理是这样的代码 -

classes.orderByKey().on("child_added", function(snapshot) { 
    var z = document.createElement("option"); 
    z.setAttribute("value", snapshot.key); 
    var t = document.createTextNode(snapshot.key); 
    z.appendChild(t); 
    dropDown.appendChild(z); 
}); 

其中填充的下拉菜单，从数据库中，发生这种情况时，该功能changeTable（）被调用一次项目（我猜是因为有一个新的在添加项目时选择的值），然后无论我更改选择选项多少次都不做任何事情，但是，如果我通过函数调用改变setAttribute（“onchange”，changeTable（））来更改setAttribute部分，而我把这个函数的实际代码作为这样的字符串/内联代码 -

dropDown.setAttribute("onchange", "console.log("hello")"); 

然后内联代码那是完美的吗？为什么这个函数调用会让我感到困惑，而且只会触发一次，但如果我使用内联代码，它会起作用？编号喜欢整理我的代码，并尽可能地做一个函数调用...

作为一个便笺是与此问题有关，一个基于选择哪个选项来填充的表，但是我需要在所有选项添加到select元素后填充表，但是我使用类似的异步函数使用orderByValue从数据库调用信息来完成此操作，并执行我需要从下拉菜单中获取当前选定的值。无论如何，我可以让这段代码等待，直到所有的值被添加到dropDown执行？

Answer 1

您不应该使用setAttribute来绑定事件处理程序，您应该使用addEventLister（）。其次，您正在调用方法并指定返回到事件的内容。

dropDown.addEventListener("change", changeTable);