Read more

IE11: Trigger native mouse events with Javascript

Henning Koch
April 06, 2016Software engineer at makandra GmbH

Use the MouseEvent constructor instead.

The attached Coffeescript helper will let you create mouse events:

$element = $('div')
Trigger.mouseover($element)
Trigger.mouseenter($element)
Trigger.mousedown($element)
Trigger.mouseup($element)
Trigger.mouseout($element)
Trigger.mouseleave($element)
Trigger.click($element)
Illustration online protection

Rails Long Term Support

Rails LTS provides security patches for old versions of Ruby on Rails (2.3, 3.2, 4.2 and 5.2)

  • Prevents you from data breaches and liability risks
  • Upgrade at your own pace
  • Works with modern Rubies
Read more Show archive.org snapshot

The dispatched events are real DOM events, which will trigger both native and jQuery handlers.
jQuery's .trigger Show archive.org snapshot is simpler, but will only trigger event handlers that were bound by jQuery's .on.

Real user actions trigger multiple events

Many user interactions trigger more than one event. E.g. when the user moves the mouse over a button and "clicks" the mouse, she actually triggers a sequence of events (mouseover, mousedown, focus, mouseup, click).

To help emulate this, the Trigger helper has a couple of additional functions that emit event sequences:

Trigger.clickSequence($element) # triggers mouseover, mousedown, focus, mouseup, click
Trigger.hoverSequence($element) # triggers mouseover, mouseenter
Trigger.unhoverSequence($element) # triggers mouseout, mouseleave

Passing modifiers

You can also pass options, e.g. to simulate a right button click while the CTRL-key was pressed:

Trigger.click(button: 2, ctrlKey: true)

See MDN's full list of options Show archive.org snapshot . Also note that browsers will not execute Javascript for some combinations of modifiers.


This was extracted from Unpoly Show archive.org snapshot .

Posted by Henning Koch to makandra dev (2016-04-06 09:40)