0

I have been trying to find out more about mouse events such as onmouseover, onmouseout and onmousemove but there is not much info. It seems these event handlers by default have a single argument, the event its self.

element.onmouseover = mouseoverFunction

function mouseoverFunction( event ) {
    // Do stuff here
}

However I want to be able to pass other arguments to into the function.

function mouseoverFunction( event, moreArgs ) {
    // Do stuff here
}

How do I pass the event argument and additional arguments to the function?

Also is it ok to pass more arguments into an event handler function?

McShaman
  • 3,627
  • 8
  • 33
  • 46

1 Answers1

6

You can make a higher-order function:

function mouseover(arg1, arg2) {
  return function(event) {
    // Do stuff here
  }
}

element.addEventListener('mouseover', mouseover(1, 2))
elclanrs
  • 92,861
  • 21
  • 134
  • 171
  • I did look at that but saw it was not supported by IE8 and under – McShaman Jan 20 '15 at 20:52
  • 1
    Look for an `addEventListener` polyfill, or use the `onmouseover` attribute as you were doing. – elclanrs Jan 20 '15 at 20:53
  • @elclanrs, I was looking forward to call & apply methods. Is this possible to do that using them. I couldn't pass in event into the function if I pass in other arguments – Valary o Aug 09 '20 at 19:28