Named event handlers in JavaScript
In the previous lessons, we used anonymous functions as event handlers. This is actually not necessary - the function can be ordinary, with a name. For example, let's say we have the following function:
function func() {
console.log('!!!');
}
Let's also have a button:
<input id="button" type="submit">
Let's make it so that when the button is
clicked, our function func
is executed.
To do this, with a parameter of
addEventListener
we will pass the
name of our function, like this:
let button = document.querySelector('#button');
button.addEventListener('click', func);
function func() {
console.log('!!!');
}
Given the following HTML code:
<input id="button1" type="submit" value="button1">
<input id="button2" type="submit" value="button2">
Given the following functions:
function func1() {
console.log(1);
}
function func2() {
console.log(2);
}
Make it so that when the first button
is clicked, the function func1
is executed, and when the second button
is clicked, the function func2
is executed.