Jquery implements the keyboard listening program code

Example

The code is as follows:

Copy code

<Script src = "jquery-1.11.0.min.js" type = "text/javascript"> </script> <Script type = "text/javascript">   // Obtain the ascII code of the keyboard; // $ (Document). keydown (function (event ){ // Alert (console. log (event. keyCode )); // Alert (event. keyCode ); //});   $ (Document). keydown (function (event ){ // When event. keyCode is 37 (that is, the left side key), the to_left () function is executed (); // When event. keyCode is 39 (that is, the right side key), the to_right () function is executed (); If (event. keyCode = 37 ){ Alert ('left '); } Else if (event. keyCode = 39 ){ Alert ('right ');             } Else if (event. keyCode = 27 ){ Alert ('esc key ');             } Else if (event. keyCode = 13 ){ Alert ('Enter key ');             } Else { Alert ('The ASCII code of the button, '+ event. keyCode );             } }); </Script> <! -- The keydown event is triggered when the keyboard is pressed. The keyup event is triggered when the key is released, that is, the event after you press the keyboard. The keypress event is triggered when you press a key. We can understand it as pressing and lifting the same key. -->

In the application, more events will be monitored. For example, we can use the upper and lower pages to enable the keyboard to press left and right. Below are some examples.

The implementation logic is relatively simple, that is, the slideDown () method,
Js code collection code

The code is as follows:

Copy code

// Shows a given element and hides all others Function showViaKeypress (element_id) {    $ (". Container" ).css ("display", "none "); $ (Element_id). slideDown ("slow "); }        // Shows proper DIV depending on link 'href' Function showViaLink (array) {    Array. each (function (I)     {       $ (This). click (function ()         {    Var target = $ (this). attr ("href "); $ (". Container" ).css ("display", "none "); $ (Target). slideDown ("slow "); }); }); }

 
 
The keypress () method is used to listen to keyboard keys, which is actually not difficult, but we seldom use button listening on pages. This example is novel and worth your reference, it can be used in projects if necessary.
Js code collection code

The code is as follows:

Copy code

$ (Document). keypress (function (e)     {    Switch (e. which)         {    // User presses the "" Case 97: showViaKeypress ("# home "); Break;                             // User presses the "s" key Case 115: showViaKeypress ("# about "); Break;                             // User presses the "d" key Case 100: showViaKeypress ("# contact "); Break;                             // User presses the "f" key Case 102: showViaKeypress ("# awards "); Break;                             // User presses the "g" key Case 103: showViaKeypress ("# links ");         }    });