例子
代码如下
复制代码
<script src="jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
//获取键盘ascII码;
//$(document).keydown(function (event) {
// alert(console.log(event.keyCode));
// alert(event.keyCode);
//});
$(document).keydown(function (event) {
//判断当event.keyCode 为37时(即左方面键),执行函数to_left();
//判断当event.keyCode 为39时(即右方面键),执行函数to_right();
if (event.keyCode == 37) {
alert('左');
} else if (event.keyCode == 39) {
alert('右');
}
else if (event.keyCode == 27) {
alert('esc键');
}
else if (event.keyCode == 13) {
alert('回车键');
}
else {
alert('这按钮的ASCII码,是' + event.keyCode);
}
});
</script>
<!--
keydown事件会在键盘按下时触发.
keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件
keypress事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键
-->
在应用中绑定事件的监控会更多,如我们利用上下页来实现键盘按左右来实现,下面整理了差不多的例子。
实现效果的逻辑比较简单,也就是slideDown()方法,
Js代码 收藏代码
代码如下
复制代码
// 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");
});
});
}
而对键盘按键的监听是用的keypress()方法,其实也没什么难度,不过我们很少在页面上使用按键监听,这个例子比较新奇,值得我们参考,如有必要时,可以在项目里用用。
Js代码 收藏代码
代码如下
复制代码
$(document).keypress(function(e)
{
switch(e.which)
{
// user presses the "a"
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;
&