Identify KeyCodes with Jquery

Identifying the keyCodes of the keyboard can be extremely useful in situations like validating the input from users or making some special action an pressing a particular key. This tutorial shows you a simple way of identifying the keyCodes of the keyboard keys. Jusrt check out the live demo.



Live demo

Jquery Code

<script language="javascript">
$(document).ready(function()
{
var notify = function()
{
$('#result').empty().html('KeyCode : '+event.keyCode);
};
$('#text').keyup(function()
{
notify();
});
});

</script>
<body>
</head>
<div id="main">
<div class="heading">Know Your KeyCode</div>
<textarea id="text"></textarea><br />
<label>Enter Any key to know its keyCode</label>
<div id="result"></div>
</div>
</body>

CSS

body{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:16px;
}
#main{
width:300px;
padding:10px;
text-align:center;
}
#text{
color:#CC6633;
border:2px solid #ff00ff;
height:90px;
width:300px;
}
#result{
border:2px solid #ececec;
color:#996633;
margin:10px;
width:300px;
}
.heading{
background-color:#2859AA;
border:1px solid #121649;
color:#FFFFFF;
font-weight:bold;
padding:3px;
width:300px;
text-align:center;
}

Written by Arvind Bhardwaj

Arvind is a Magento and WordPress expert with more than 6 years of industry wide experience.

Website: http://www.webspeaks.in/

One thought on “Identify KeyCodes with Jquery

Comments are closed.