章节
问答
课签
笔记
评论
占位
占位

jQuery键盘事件之keydown()与keyup()事件

鼠标有mousedown,mouseup之类的事件,这是根据人的手势动作分解的2个触发行为。相对应的键盘也有这类事件,将用户行为分解成2个动作,键盘按下与松手,针对这样的2种动作,jQuery分别提供了对应keydown与keyup方法来监听

keydown事件:

当用户在一个元素上第一次按下键盘上字母键的时候,就会触发它。使用上非常简单,与基本事件参数处理保持一致,这里使用不在重复了,列出使用的方法

//直接绑定事件
$elem.keydown( handler(eventObject) )
//传递参数
$elem.keydown( [eventData ], handler(eventObject) )
//手动触发已绑定的事件
$elem.keydown()

 

keyup事件:

当用户在一个元素上第一次松手键盘上的键的时候,就会触发它。使用方法与keydown是一致的只是触发的条件是方法的

 

注意:

  • keydown是在键盘按下就会触发
  • keyup是在键盘松手就会触发
  • 理论上它可以绑定到任何元素,但keydown/keyup事件只是发送到具有焦点的元素上,不同的浏览器中,可获得焦点的元素略有不同,但是表单元素总是能获取焦点,所以对于此事件类型表单元素是最合适的。

 

 

任务

在右边代码47 53行处,分别填入任务代码

在47行处,监听用户的按下事件
在53行处,监听用户的松手事件
?不会了怎么办

keydown

keyup

||
1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最新回答 / 陆扬灵
“keydown事件触发在文字还没敲进文本框,这时如果在keydown事件中输出文本框中的文本,得到的是触发键盘事件前的文本”因为监听的是已经显示在输入框中的,按下5的时候前面只有1234,同理第一个按下的时候原本是没有的

最新回答 / 慕的地4232940
   <script type="text/javascript">        $(document).keydown(function (e) {            // 处理组合键            if (e.ctrlKey && e.which == 13) {                alert("crtl+enter");                return false;            }                //处理功能...

最新回答 / 金刚无敌葫芦娃
这个教程中e是element的简写意思是这个元素即你理解的引起事件的对象可以是e,也可以是a,也可以是b,也可以是xiaoming只是这个写教程的人喜欢用e

最赞回答 / wxyxh蓝白碗
keydown事件触发在文字还没敲进文本框,这时如果在keydown事件中输出文本框中的文本,得到的是触发键盘事件前的文本,就是当你按下键盘时先触发keydown,再显示字母

最新回答 / VictorChan
是的 你应该发在评论里

最新回答 / feng520
知道了,用e.key或者e.which

已采纳回答 / Pruett
获取的是text是目标的值,在你按下的时候执行这个函数,但是将一个字符输入到目标中是在按键松开的时候才写入,所有在第一次,甚至是每一次按下的时候都不会有当前的按键字符显示,

最新回答 / 胖丫
<!DOCTYPE html><html><head>    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />    <title></title>    <style>    .left div,    .right div {        width: 500px;        height: 50px;        pad...

最赞回答 / yelllowsky
我的也是,应该是keydown是要按下触发事件,你第一次的时候val值是空的,按第二个的时候才出现第一次的值;keyup是按下val有值1,松开显示

最新回答 / qq_Dandelion_3
回头看一看click的三个案例,其实意思都是一样的。

已采纳回答 / 番茄炒鸡蛋丶丶
handler(eventObject) 就是我们经常看到的function(){}  一个函数  里面的eventObject从字面上理解就是事件对象,一般来讲你看到handler(eventObject)都会在事件处理机制中看到  比如.click(handler(eventObject)) 事件对象就是你点击的对象(因为是点击事件)   evetData  就是函数的事件参数了   相信你以前学funtion 的时候也会知道有时候定义函数会传参数进去 这个就是类似的                 ...

已采纳回答 / 时有语默
e.target表示该DOM元素,然后在获取其相应的属性值。

已采纳回答 / 我要睡觉
keydown 是在按之前判断(当时text还没有内容),触发一次空,当下一次按键时,就触发上一次输入的内容,所以就少一个。

已采纳回答 / 云彩无色3804005
我也遇到了,我每次都是改下库文件就好了http://libs.baidu.com/jquery/1.9.1/jquery.js
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言