onmousemove, what is being pass to event - javascript

Question

I've done couple of research about events in javascript but still can't figure out what is being pass to event in onmousemove.

excerpt from: W3schools

onmousemove="show_coords(event)"

what is this event argument? Do I really need it? Or I could somehow make it work without the event argument like this:

onmousemove="show_coords()"

I tried everything to make it work without event argument but I think I'm missing something here.

edit:

Here's what i was playing around with.

Yes - It's working fine but I just don't understand why I need event and what is it when working with mouse coordinates

This >>> onmousemove="show_coords(event)"

To This >>> onmousemove="show_coords()" And make it work

Why does (.clientX/Y, .pageX/Y, .screenX/Y) needs the event? Is there a way to access them without it.

I tried chaging the "event" argument and every event word to "this"

Just like this >>> onmousemove="show_coords(this)"

but that doesn't work. Why?

    <!DOCTYPE html>
<html onmousemove="show_coords(event)" style="border-style: solid">
<head>
</head>

<body>


<p style="position : fixed; color :red; top: 50px" id="demo"></p>

<p style="position : fixed; color :blue ;top: 10px" id="demo2"></p>

<p style="position : fixed; top: 31px" id="demo3"></p>

<div style="height: 1000px"></div>
<script>
    function show_coords(event)
    {
        var x=event.clientX;
        var y=event.clientY;
        var xa=event.pageX;
        var ya=event.pageY;
        var xb=event.screenX;
        var yb=event.screenY;

      document.getElementById('demo').innerHTML = "Client: x = " + x + " y = " + y;

      document.getElementById('demo2').innerHTML = "Page: xa = " + xa + " ya = " + ya;

      document.getElementById('demo3').innerHTML = "Screen: xb = " + xb + " yb = " + yb;
    }
</script>
</body>
</html>

Possible duplicate of [Javascript: what exactly is parameter e(event) and why pass it to javascript function?](https://stackoverflow.com/questions/35936365/javascript-what-exactly-is-parameter-eevent-and-why-pass-it-to-javascript-fun) — heliosk, May 30 '17 at 14:16
What do you want to trigger? Do you need the mouse coordinates, or do you just want to know that the mouse moved? — Emmanuel Delay, May 30 '17 at 14:17
what are you trying to achieve? can you post your complete code? — threeFatCat, May 30 '17 at 14:17
The above function implementation has nothing to do with event argument. That argument is optional.Share the complete code please. What all are you trying to implement and which library you are using ? — Harrisss, May 30 '17 at 14:17
"excerpt from: W3schools" — Avoid them. [They are better than they used to be](http://www.w3fools.com/) but are still terrible. — Quentin, May 30 '17 at 14:18
Intrinsic event attributes are [weird](https://stackoverflow.com/questions/31613748/why-cant-i-call-a-function-named-clear-from-an-onclick-attribute/31613889#31613889) and don't [seperate concerns](https://en.wikipedia.org/wiki/Separation_of_concerns). Use [JS event binding instead](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener). — Quentin, May 30 '17 at 14:19

Quentin · Answer 1 · 2017-06-01T10:54:47.193

what is this event argument

Event objects are objects that contain information about the event (such as exactly what element was used to trigger it) and methods to manipulate it (e.g. to stop it bubbling up the DOM).

Or I could somehow make it work without the event argument like this

There's no requirement to do anything with the event object that gets passed into an event handler function.

If your show_coords function depends on it (re edit: It does), then you need to either pass it or find some other way to do whatever the show_coords function does with it.

I tried chaging the "event" argument and every event word to "this" but that doesn't work. Why?

Because the event and the element to which the event handler is bound are completely different things. It's the difference between "John's journey to Wales" and "John's car".

onmousemove, what is being pass to event - javascript

1 Answers1