jQuery 键盘事件keydown ,keypress ,keyup介绍

编程技术  /  houtizong 发布于 3年前   213

本文章总结了下些关于jQuery 键盘事件keydown ,keypress ,keyup介绍，有需要了解的朋友可参考。

一、首先需要知道的是：
1、keydown()
keydown事件会在键盘按下时触发.
2、keyup()

 代码如下 复制代码

$('input').keyup(funciton(){
          alert('keyup function is running!!');
        });

keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件

3、keypress()

keypress()事件和keydown是差不多的，只有一个例外，如果需要阻止按键的默认行为，你必须是哟就keypress事件

例1

 代码如下 复制代码

$(selector).keydown(function(event){
 var key_code = event.keyCode;
 if (key_code==13)
 {
  xxxxxx();
 }
});

event.keyCode能够得到当前按键的代码，用到下面即可。

实例

 代码如下 复制代码

$(document).keydown(function(event){
console.log(event.keyCode);
});

$tips: 上面例子中,event.keyCode就可以帮助我们获取到我们按下了键盘上的什么按键,他返回的是ascII码,比如说上下左右键,分别是38,40,37,39；

三、实例（当按下键盘上的左右方面键时）

 

 代码如下 复制代码
$(document).keydown(function(event){
//判断当event.keyCode 为37时（即左方面键），执行函数to_left();
//判断当event.keyCode 为39时（即右方面键），执行函数to_right();
if(event.keyCode == 37){
//do somethings;
}else if (event.keyCode == 39){
//do somethings;
}
});

注意

在jQuery中keydown，keypress，keyup事件是按一定的顺序执行的。
     

 代码如下 复制代码
   $('input').keyup(function(){
          console.log('keyup');
           });
        $('input').keydown(function(){
          console.log('keydown');
           });
        $('input').keypress(function(){
          console.log('keypress');
           });

执行结果是：keydown ,keypress ,keyup .

 

From: http://www.111cn.net/wy/jquery/45752.htm

上一篇：html页面js获取参数值
下一篇：集合框架

请勿发布不友善或者负能量的内容。与人为善，比聪明更重要！

留言需要登陆哦

技术博客集 - 网站简介：
前后端技术：
后端基于Hyperf2.1框架开发,前端使用Bootstrap可视化布局系统生成
网站主要作用：
1.编程技术分享及讨论交流，内置聊天系统;
2.测试交流框架问题，比如：Hyperf、Laravel、TP、beego;
3.本站数据是基于大数据采集等爬虫技术为基础助力分享知识，如有侵权请发邮件到站长邮箱，站长会尽快处理;
4.站长邮箱：[email protected];

      订阅博客周刊 去订阅

文章归档

文章标签

友情链接

首页
关于我们
Auther ·HouTiZong
侯体宗的博客
© 2020 zongscan.com
版权所有ICP证 : 粤ICP备20027696号
PHP交流群 也可以扫右边的二维码
侯体宗的博客