Capturing Mouse Events Using JavaScript : A Step Ahead Series

Sometime there is a need to disable MouseEvents for specific task(s) in Web-Pages. The following code-snippet shows how to achieve the same :

<DIV><B>Testing with Link Button : </B>

<A onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" href="javascript:void(null)">Click here with various mouse buttons to test</A> </DIV><BR>
<DIV>

<B>Testing wuth Submit Button : </B>

<INPUT onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" type=submit value="Submit Query" name=btnG> </DIV><BR>
<DIV>

<B>Testing with Input Text : </B>

<INPUT onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" name=btnG>

 </DIV>

<SCRIPT language=Javascript>
function captureButton(event)
{
    var button;
    if (event.which == null)
       button= (event.button < 2) ? "MOUSE BUTTON : LEFT" :
                 ((event.button == 4) ? "MOUSE BUTTON : MIDDLE" : "MOUSE BUTTON : RIGHT");
    else
       button= (event.which < 2) ? "MOUSE BUTTON : LEFT" :
                 ((event.which == 2) ? "MOUSE BUTTON : MIDDLE" : "MOUSE BUTTON : RIGHT");
    alert(button);
    preventOperation(event);
}
function preventOperation(event)
{
    if (event.preventDefault)
        event.preventDefault();
    else
        event.returnValue= false;
     return false;
}
</SCRIPT>

See it in Action