Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 221
  • Last Modified:

jQuery's event object's metakey property not working

I was trying out a sample code, and I noticed the metakey property of the event object is not working as it keeps reporting back false even when I press the ctrl key in Windows 7. Can anyone please tell me why? I checked jQuery's bug tracker, they say it has been fixed, but not from my point of view, especially since it doesn't work on any browser I tested this with (IE, Firefox, Opera, Chrome, and Safari).

<!DOCTYPE html>
<html>
<head>
    <title>jQuery Event Handling</title>
    <link rel="stylesheet" href="../style.css"/>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script type="text/javascript">
        $("document").ready(function() {
            $("#example").on("mousemove", onMouseOver);
            $("#example").on("click", onMouseClick);
            $("#example").on("mouseleave", onMouseLeave);
        });
        
        function onMouseOver(evt) {
            $("#example").text(evt.type + ": " + evt.pageX + ", " + evt.pageY
                               + "\n" + "Button: " + evt.which + 
                               " Key: " + evt.metaKey);
        }
        function onMouseClick(evt) {
            $("#example").text(evt.type + ": " + evt.pageX + ", " + evt.pageY);
            $("#example").off("mousemove", onMouseOver);
        }
        function onMouseLeave(evt) {
            $("#example").text("mouseleave");
        }
    </script>
</head>
<body>
    <h1>jQuery Event Handling</h1>
    <p>jQuery normalizes an event structure across browsers and provides cross-browser consistency for properties such as the event name, the page coordinates of the mouse, the element where the event originated along with any other element related to the event, and information such as whether a meta-key or specific mouse button was pressed.</p>
    <div id="example">
    </div>
</body>
</html>

Open in new window

0
elepil
Asked:
elepil
  • 2
1 Solution
 
RobOwner (Aidellio)Commented:
The ctrl key isn't classed as a meta key. The Windows key is the only meta key on standard keyboards and it seems that key isn't exposed to the browser to capture.
0
 
RobOwner (Aidellio)Commented:
see here for a demo using the ctrl key: http://jsbin.com/piyuwu/1/edit?html,js

I've also changed your events to be captured over the <body>, not the empty "example" div
0
 
elepilAuthor Commented:
Thanks, Rob, that answers my question!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now