Adding more parameters to Javascript event functions

Question

How do I add extra parameters to a javascript event function? I want my current event functions to take in more parameters than just an event.

My current code is:

function getMousePos(canvas, evt) {
    var rect = canvas.getBoundingClientRect();
    return {
        x: (evt.clientX - rect.left) / (rect.right - rect.left) * canvas.width,
        y: (evt.clientY - rect.top) / (rect.bottom - rect.top) * canvas.height
    };
}

function give_mouse_coord(e) {
    var pos = getMousePos(canvas, e);
    
    var pos_x = pos.x
    var pos_y = pos.y
 }

window.addEventListener('click', give_mouse_coord, false);

but I want to have the give_mouse_coord take in other parameters as well, for example:

function give_mouse_coord(e, scalar) {
    var pos = getMousePos(canvas, e);
    
    var pos_x = pos.x * scalar
    var pos_y = pos.y * scalar
 }

I want the window.addEventListener to run my functions but when I try adding more parameters the function won't run.

You don't have to pass the name of a function to addEventListener. You can pass an anonymous function instead that does whatever, including calling other functions. What I'm saying is that you cannot change the fact that the JS engine only passes the event to the handler function but that doesn't mean you can't just do arbitrary stuff yourself, at any point. — user5734311
– user5734311, Commented Oct 6, 2021 at 18:23

georg · Accepted Answer · 2021-10-06 18:15:42Z

3

Just wrap your handler function in an ad-hoc arrow func:

window.addEventListener('click', e => give_mouse_coord(e, whatever), false);

answered Oct 6, 2021 at 18:15

georg

216k57 gold badges324 silver badges401 bronze badges

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

1 Comment

user5734311 Over a year ago

I thought there's going to be a bunch of duplicates for sure but looking for them I found lots of really bad (and accepted) answers to this very same question. Couldn't find a dupe presenting this simple and obvious solution so I gave up :/

Collectives™ on Stack Overflow

Adding more parameters to Javascript event functions

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related