Click event listener

Question

I'm working on an Electron-based application, and I don't have much experience with it or JavaScript or Node.js. Currently, I just want to close a window by a click on a button.

close.addEventListener('click', function () {
    ipc.send('close-main-window')
})

This totally works! I am just confused with why it works. From what I understand, the first argument in addEventListener is just any arbitrary string. However, I don't specifically write anything to handle a 'click'. This should mean it's built in functionality, I think. Is this part of JavaScript, Node.js, or Electron? And where in the documentation can I find a list of built in events?

Andrew Li · Accepted Answer · 2016-08-30 05:35:48Z

2

JavaScript has the function addEventListener which adds an event listener (surprise, surprise) to an element. The element in which the listener is applied to now listens for an event, a string passed into the function (in this case click). Once the event is triggered (in this case when a user clicks on the element), it will execute the callback, which is the function you declared. So, consider this:

element.addEventListener("click", function() {
    console.log("hello!");
});

This will log hello every time element is clicked.

You can read more at the Mozilla's Documentation. Here's a list of all the available events.

edited Aug 30, 2016 at 5:35

answered Aug 30, 2016 at 5:30

Andrew Li

58.1k14 gold badges135 silver badges150 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Timothy Deng Over a year ago

Thanks! Are these events just strings? And if so, isn't that sort of bad design? Wouldn't it be preferable for them to have an enum or a list of properties?

Andrew Li Over a year ago

The string is passed into a constructor to create a new Event object, var event = new Event(string_from_addEventListener);, so the string is necessary to create an event

brk · Accepted Answer · 2016-08-30 05:43:25Z

0

The first argument is string which represent the event type.

I think internally it works like this

var event = new Event('click');

where Event is an event object & click is already a predefined event of javascript

answered Aug 30, 2016 at 5:43

brk

50.3k10 gold badges59 silver badges85 bronze badges

Collectives™ on Stack Overflow

Click event listener

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related