Question

Can there be or is there something already, that can allow me to add multiple event listeners with multiple functions for different elements… on a single line? Maybe an example will help me explain…

I am coming across situations like this in my code:

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);

It seems it might be VERY nice to have something along the way of this to shorten the code!

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

I hope this makes sense. Any ideas? If something like this already exists I would like to know. Otherwise maybe I could make a helper function (called makeEvents, or something), that would split the string, and for each element, then each function, attach each event?

I know my existing code logic doesn’t make perfect sense at the moment, but I am mostly curious if this could be easily done or already exists.

Answer 1

jquery can bind multiple events to multiple elements

$(inputUrl).add(inputDirectory).bind("keydown, keyup, click", function(){
     resizeInput(this);     
     saveOptions(this);
});