I'm trying to force mouseup event after mousedown

Question

elements[0].onmousedown = function(){
      console.log('screen clicked.');
      simulatemouseuphere;
};

All I need to do is add something in my function that triggers mouseup, even if the user is holding the click button down.

elements[0] is my entire page scope, so anywhere you click, it will trigger.

Have a look - http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onmousedown — SK., Jul 23 '15 at 13:24

Spacemonkey · Accepted Answer · 2015-07-23T13:44:02.203

1

I'm pretty sure you can just call the onmouseup event...

elements[0].onmousedown = function(){
      console.log('screen clicked.');

      elements[0].onmouseup();
};

Keep in mind that when you actually physically stop holding the mouse down though, the mouseup event will be triggered again. (unless in the onmouseup() event you manage that)

Tested quickly, looks like it works: http://jsfiddle.net/cUCWn/40/

edited Jul 23 '15 at 13:44

answered Jul 23 '15 at 13:34

Spacemonkey

211
3
10

That is doing exactly what I need. I can connect the dots from here, thank you so much. – abejdaniels Jul 23 '15 at 14:09
I am getting returned an error of "Cannot read property 'onmouseup' of null. `function simMouseUp() { document.getElementById('keyboardBG').onmouseup(); } function test() { console.log("Mouse is up!"); }` – abejdaniels Jul 23 '15 at 14:14
if you are attempting to do this before the page has fully loaded it may be that your element does not yet exist (I'm assuming it's not that it doesn't find it because the ID is wrong) - without more info I'm afraid we might not be able to help much – Spacemonkey Jul 23 '15 at 14:20
This will only work if you set your handler using `element.onmouseup`, and if you are not using the event object in the handler. For something more robust see http://stackoverflow.com/questions/2381572/how-can-i-trigger-a-javascript-event-click/2381862#2381862 – Ruan Mendes Jul 23 '15 at 14:24
You won't have access to original the event object inside the mouseup function. – klenium Jul 23 '15 at 14:33

score 1 · Answer 2 · answered Jul 23 '15 at 13:47

Just a guess, but instead of firing a mouseup event, perhaps you want to trigger the function that is bound to the mouseup event?

var onMouseUp = function() { 
 /* something */  
};

var onMouseDown = function() { 
 /* something */ 
 onMouseUp.apply(this,arguments); 
};

elements[0].onmousedown = onMouseDown;
elements[0].onmouseup = onMouseUp;

score 0 · Answer 3 · edited May 23 '17 at 10:27

0

$("body").on("mousedown", function(e)
{
    e.type = "mouseup";
    $(this).trigger(e);
}).on("mouseup", function(e)
{
    console.info(e);
});

Or: https://stackoverflow.com/a/12724570/2625561

For pure JS: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events#Triggering_built-in_events

edited May 23 '17 at 10:27

Community

1
1

answered Jul 23 '15 at 13:35

klenium

2,468
2
24
47

We don't know that abejdaniels is using jQuery, so this might not be helpful – StephenTG Jul 23 '15 at 13:37
Better, but this is essentially a link-only answer if you disregard the jQuery solution. You should try to give the key information from the link in your answer directly – StephenTG Jul 23 '15 at 13:47

score 0 · Answer 4 · edited May 23 '17 at 12:15

All the ways that are described here depend on how you set up the listener: jQuery, element property.

If you want a robust way that will work regardless of how the event was setup, use How can I trigger a JavaScript event click

elements[0].onmousedown = function(){
    fireEvent(elements[0], 'onmouseup');
};

Notice that you are probably better off wrapping the behavior of the mouseup handler into a function that you can call. Triggering handlers is usually code smell because you don't always know what else you may be triggering when firing events. For example:

function doSomethingOnMouseUp() {
    console.log('something on mouse up');
}

elements[0].onmousedown = function(){
    doSomething();
    doSomethingOnMouseUp();
};

elements[0].onmouseup = doSomethingOnMouseUp;

I'm trying to force mouseup event after mousedown

4 Answers4