2

Event though a right-click (as far as I know) fires a mousedown event, that mousedown seems to be ignored in most cases. I'm currently working on displaying a custom context menu via a right-click, but I'd also like to be able to select an option from a list while I'm right-clicking. As of right now my recognizes the click from both buttons enough to run some javascript tied to the onmousedown attribute but not enough to select the option the mouse is over when the mousedown comes from the right button.

Is there a way to bypass a browser's default behavior of ignoring the mousedown event of a right-click or fool it into thinking the mousedown was generated by the left button instead?

Thanks in advance.

hSherlock
  • 150
  • 3
  • 12

2 Answers2

0

You can use the oncontextmenu event.

Edit: To simulate the default click behavior on an <option> during a right mouse click, put this code in your event handler when handling right click:

clickedOption.parentNode.selectedIndex = clickedOption.index;
gilly3
  • 87,962
  • 25
  • 144
  • 176
  • I need specifically to access the functionality of the onmousedown event in order to select an potion while right-clicking. What happens after the click is easy enough to modify using either onmousedown or oncontextmenum but without the initial left-click behavior of the onmousedown I'm lost. – hSherlock Aug 08 '11 at 21:26
  • So, your question is, "How do I select an option from a list when the right mousebutton is clicked?" Is that right? Are you talking about a ` – gilly3 Aug 08 '11 at 21:29
  • specifically an is what I'm trying to select from within an – hSherlock Aug 09 '11 at 16:12
  • @Zach - You must be talking about server elements that I'm not familiar with. What is the generated HTML? A ` – gilly3 Aug 09 '11 at 17:49
  • Oh right. I'm doing the actual coding using Java Server Faces tags. I believe you're right on. The generated HTML is a – hSherlock Aug 09 '11 at 18:03
-1

If you are willing to use jQuery, you can simply use mousedown:

$(document).bind('contextmenu', function(event) 
{
   // on right click
   if (event.which == 3)
   {
      // prevent right click from being interpreted by the browser:
      event.preventDefault(); 

      $(document).mousedown(); // simulate left click
   }
});

Of course you can use a fitting selector. This is great since that way, the right click is only serving as a left click on certain elements of your website. That way, it's still possible to use the mouse as expected most of the time (depending on your selectors).

EDIT: better example

<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $("#rightclick").bind('contextmenu', function(event) {

         // on right click
         if (event.which == 3)
         {
            // prevent right click from being interpreted by the browser:
            event.preventDefault(); 
            $(this).click(); // simulate left click
         }
      });

      $('#rightclick').click(function() {
        $(this).html("i have been clicked!");
      });
    });
  </script>
</head>
<body>
  <p>This is a web page.</p>

  <div id="rightclick" style="width:200px; height:100px; background-color: orange">
    Click me with the right or left mouse button. Both will work!
  </div>
</body>
</html>
EinLama
  • 2,376
  • 1
  • 14
  • 10
  • Can you shed some more light on the fitting selector you mentioned? – hSherlock Aug 08 '11 at 21:27
  • You can provide a selector to the jQuery-function $(). If you want to override the rightclick only when the users clicks on a div with the class "rightclick", you have to replace the above `document` with "div.rightclick": `$("div.rightclick").mousedown ...` – EinLama Aug 09 '11 at 05:49
  • Thanks for the code example and explanation. I'm a bit of a newbie with presentation-tier stuff. I'll give it a shot. – hSherlock Aug 09 '11 at 16:13
  • Thanks for the help. I couldn't get it to work though. Probably a problem with how I coded it. – hSherlock Aug 15 '11 at 16:42