Javascript - left mouse button function executes only once LMB is released

0
votes

I am trying to make an HTML5 game that as long as the player is pressing the LMB, the bullets keep spawning, and once LMB is released, the shooting stops. This is my function: 

document.onclick = function(mouse){ 
    console.log("Shoot");
}

Only once the LMB is released, that message is showing up in the console log. I did look over stackoverflow and found this: Qt mouseMoveEvent only when left mouse button is pressed But I failed to integrate it into my canvas... it just won't do anything. Thank you for your time.

3
javascriptfunctionmouse
If by 'bullets spawning', you mean console.log("shoot");, you just need to use mousedown instead of .onclick. But if you want some function to keep running (e.g fireBullet();) while the key is being held down, you can refer to my answer. – salmanxk

3 Answers

1
votes

If you need to execute code when the mouse is pressed you should be using mousedown instead of onclick.

Check the Mouse Events examples on w3c. http://www.w3schools.com/js/js_events_examples.asp

1
votes

"onclick" calls the function on mouse click up. You need a more specific event listener.

What your looking for, assuming your use case is accurate, is "onmousedown".

See this link for more info: http://www.w3schools.com/jsref/event_onmousedown.asp

Simply replace "onclick" with "onmousedown".

Hope that helps!!

0
votes

The onclick method is invoked when you release the mouse button instead of being held down. What you need is the mousedown method.

Also, you need to reword your question a bit. As I understand,

you want something to happen while the mouse key is being held down.

To do that, you need to invoke the mousedown activity in some reasonable interval.

var mousedownID = -1;  //Global ID of mouse down interval
function mousedown(event) {
  if(mousedownID==-1)  //Prevent multimple loops!
     mousedownID = setInterval(whilemousedown, 100 /*execute every 100ms*/);


}
function mouseup(event) {
   if(mousedownID!=-1) {  //Only stop if exists
     clearInterval(mousedownID);
     mousedownID=-1;
   }

}
function whilemousedown() {
   /*put your code here*/
   /* i.e, whatever you what to keep on happening while the button is down*/
}
//Assign events
document.addEventListener("mousedown", mousedown);
document.addEventListener("mouseup", mouseup);
//Also clear the interval when user leaves the window with mouse
document.addEventListener("mouseout", mouseup);