diff --git a/snippets/addMultipleEvents.md b/snippets/addMultipleEvents.md new file mode 100644 index 000000000..b3e63f3fd --- /dev/null +++ b/snippets/addMultipleEvents.md @@ -0,0 +1,24 @@ +--- +title: addMultipleEvents +tags: JavaScript, Browser, Events, beginner +--- + +Add multiple event listener to an element. + +- Use Array.prototype.forEach() and EventTarget.addEventListener() to add multiples event listener with an assigned callback function to an element. + +```js +const addMultipleEvents = (el, evts) => { + evts.forEach(evt => el.addEventListener(evt.name, evt.fn, false)); +} +``` + +```js +addMultipleEvents(document.querySelector('.textInput'), + [ + {name: 'mousedown', fn: () => console.log('mousedown event')}, + {name: 'touchstart', fn: () => console.log('touchstart event')}, + {name: 'change', fn: () => console.log('change event')} + ] +); +```