SitePoint Sponsor

User Tag List

Results 1 to 8 of 8

Thread: Detect Fn keys

  1. #1
    SitePoint Enthusiast madrid400's Avatar
    Join Date
    Apr 2005
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Detect Fn keys

    I've read some about an event handler for detect the press of any "normal" keys as letters and so on.

    How can detect also the Fn keys as F3, F5, F9... and even these keys with upper key (i.e. caps+F1 = F13).

    of curse I like to work at least in the main updated browsers.

    Thaks in advance.

  2. #2
    SitePoint Wizard silver trophy someonewhois's Avatar
    Join Date
    Jan 2002
    Location
    Canada
    Posts
    6,364
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't think you can. The only code I know of to detect the keys returns the F-keys as 0. I think this is good. Otherwise you could potentially lock the person from closing their browser (lock the mouse and keyboard) -- the F keys are a last resort sort of.

    You're probably better off to just use ctrl+1, ctrl+2, or something.

  3. #3
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Of course, you can detect F-key like any other (event.keyCode value for Fkeys are in range 112-122). To test if shift is pressed use event.shiftKey:

    Code:
    if(event.keyCode == 112 && event.shiftKey)
       // shift + F1 pressed

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But that's IE-specific, isn't it?
    Birnam wood is come to Dunsinane

  5. #5
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What makes you think it's IE specific?

  6. #6
    SitePoint Aficionado JVLB's Avatar
    Join Date
    Jan 2002
    Location
    N 44 56.537' W 123 3.683'
    Posts
    1,127
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This script will allow you to test the codes returned by different key-related events. There are differences in how IE and standards-compliant browsers report the events. Function keys, since the browser may attach internal functions to them, can be problematic.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
     <html>
     <head>
     <title>Untitled</title>
     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
     <style type="text/css">
     td,th{border:2px solid #aaa;}
     </style>
     <script type="text/javascript">
     var t_cel,tc_ln;
     if(document.addEventListener){ //code for Moz
       document.addEventListener("keydown",keyCapt,false); 
       document.addEventListener("keyup",keyCapt,false);
       document.addEventListener("keypress",keyCapt,false);
     }else{
       document.attachEvent("onkeydown",keyCapt); //code for IE
       document.attachEvent("onkeyup",keyCapt); 
       document.attachEvent("onkeypress",keyCapt); 
     }
     function keyCapt(e){
       if(typeof window.event!="undefined"){
     	e=window.event;//code for IE
       }
       if(e.type=="keydown"){
     	t_cel[0].innerHTML=e.keyCode;
     	t_cel[3].innerHTML=e.charCode;
       }else if(e.type=="keyup"){
     	t_cel[1].innerHTML=e.keyCode;
     	t_cel[4].innerHTML=e.charCode;
       }else if(e.type=="keypress"){
     	t_cel[2].innerHTML=e.keyCode;
     	t_cel[5].innerHTML=e.charCode;
       }
     }
     window.onload=function(){
       t_cel=document.getElementById("tblOne").getElementsByTagName("td");
       tc_ln=t_cel.length;
     }
     </script>
     </head>
     <body>
     <table id="tblOne">
     <tr>
     <th style="border:none;"></th><th>onkeydown</th><th>onkeyup</th><th>onkeypress</td>
     </tr>
     <tr>
     <th>keyCode</th><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
     </tr>
     <tr>
     <th>charCode</th><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
     </tr>
     </table>
     <button onclick="for(i=0;i<tc_ln;i++){t_cel[i].innerHTML='&nbsp;'};">CLEAR</button>
     </body>
     </html>
    Last edited by JVLB; May 4, 2005 at 15:42.

  7. #7
    SitePoint Enthusiast madrid400's Avatar
    Join Date
    Apr 2005
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Wink JVLB, stereofrog, This works!

    I was using keypress, but the events and sample you mention do the work.

    Thanks very much.

    "Function keys, since the browser may attach internal functions to them, can be problematic."
    yes, I Know, my intention is using some of the Fn keys not used mainly.
    btw.... would be nice trap the key and return nothing to the browser in order to avoid the pressumed action (i.e. F1=BrowserHelp)....

  8. #8
    SitePoint Guru
    Join Date
    Mar 2004
    Location
    Earth
    Posts
    406
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There's no problem with capturing function key events, but you won't be able to override the default action - only attach new (additional) functions to that action

    Which is why, as you said, you wanna look for keys which are not already used - F12 and F7 are good in moz, safari and IE; F6, F9 and F10 are okay in Opera 8 - but those are just the default setup ... whatever you choose, someone somewhere will have it configured to do something else.

    Because ultimately, both Windows and Mac can assign almost any key to do almost anything in almost any application.

    So .. if you do function key scripting you should really add user preferences to let people change the key assignments for themselves. This is what I do with the keyboard navigation hotkey on my menu -- http://www.udm4.com/demos/module-keyboard.php

    Note also that Opera can't detect most modifier + key combinations - key events stop being reported if, for example, the ALT key is pressed down.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •