Question

是否可以为元素提供相同的事件侦听器，但可以调用2个不同的函数？

类似这样

document.getElementById("searchBar").addEventListener("keyup", populateTable);

document.getElementById("searchBar").addEventListener("keyup", createButtons);

我已经尝试过这样做，但是根据我的经验，我只能触发事件监听器中的1个。

因此，我的程序中有一个搜索栏，当用户键入该搜索栏时，下表根据用户键入的内容进行排序。该搜索栏和表格属于其他人构建但我用于项目的模块。在此模块中，该程序将事件侦听器“ change”添加到搜索栏，以使其每次用户键入时都可以搜索表。对于我的程序，我还想将相同的“更改”事件侦听器添加到搜索栏，但我想将其连接到我创建的函数，该函数将执行不同的操作。我仍然希望搜索栏在用户键入表时更改表，但是我也希望它调用我创建的函数。

我知道我可以直接进入模块代码并从其他人创建的事件侦听器中调用我的函数，但是我想看看是否有一种无需编辑模块代码即可解决此问题的方法。

谢谢！

Answer 1

我将制作一个main函数来调用这两个函数，并将其连接到事件侦听器。让我解释一下我的意思：

var call_both = function() {
    populateTable();
    createButtons();
}

然后，将其挂接到事件侦听器。

document.getElementById("searchBar").addEventListener("keyup", call_both);

是否可以将同一eventListner两次添加到元素，但是调用不同的函数？

1 个答案: