1

是否有或者已经有一些东西，可以让我为不同的元素添加具有多个功能的多个事件侦听器......在一行上？也许一个例子可以帮助我解释......

我在我的代码中遇到了这样的情况：

inputUrl.addEventListener ('keydown', saveOptions);
inputUrl.addEventListener ('keydown', resizeInput);

inputUrl.addEventListener ('keyup', saveOptions);
inputUrl.addEventListener ('keyup', resizeInput);

inputUrl.addEventListener ('click', saveOptions);
inputUrl.addEventListener ('click', resizeInput);

inputDirectory.addEventListener ('keydown', saveOptions);
inputDirectory.addEventListener ('keydown', resizeInput);

inputDirectory.addEventListener ('keyup', saveOptions);
inputDirectory.addEventListener ('keyup', resizeInput);

inputDirectory.addEventListener ('click', saveOptions);
inputDirectory.addEventListener ('click', resizeInput);

在此过程中使用一些东西来缩短代码似乎非常好！

makeEvents("inputUrl,inputDirectory|saveOptions,resizeInput|keydown,keyup,click")

我希望这是有道理的。有任何想法吗？如果这样的事情已经存在，我想知道。否则，也许我可以创建一个辅助函数（称为 makeEvents 或其他东西），它会拆分字符串，然后为每个元素，然后是每个函数，附加每个事件？

我知道我现有的代码逻辑目前并不完全有意义，但我很好奇这是否可以轻松完成或已经存在。

4

3 回答 3

3

尝试以下操作：

inputUrl.addEventListener ('keyup', function() { saveOptions(); resizeInput(); });

这样，“keyup”事件将调用这两个函数，并且您可以更好地控制调用它们的顺序。

于 2012-09-24T19:25:34.190 回答
2

jquery可以将多个事件绑定到多个元素

$(inputUrl).add(inputDirectory).bind("keydown, keyup, click", function(){
     resizeInput(this);     
     saveOptions(this);
});
于 2012-09-24T19:27:15.203 回答
1

你很幸运有人发明了函数

function setupEvents(element, action)
{
    element.addEventListener("keydown", action);
    element.addEventListener("keyup", action);
    element.addEventListener("click", action);
}

function setupActions(element)
{
    setupEvents(element, saveOptions);
    setupEvents(element, resizeInput);
}

setupActions(inputUrl);
setupActions(inputDirectory);
于 2012-09-24T19:21:11.493 回答