day-16.7 BOM常用的键盘事件(onkeydown,onkeypress,onkeyup);

BOM常用的键盘事件有:

按下:

onkeydown,:响应所有按键;

onkeypress,:只能响应键入值的按键和回车

抬起:

onkeyup,:响应所有按键;

onkeydown和onkeypress是个持续事件,即你按照键不松手,浏览器会每隔一段时间检测,检测到你按键是按着的状态就会响应事件也就是持续检测的持续事件。

onkeyup则不是,onkeyup只有松开的时候会响应,他不会持续去检测你是否松开,然后去响应事件。

并不是所有的元素都可以响应键盘事件,只有具备焦点的元素的才可以响应键盘事件;

比如input表单元素;

a标签,超链接元素;

普通元素比如div,可以通过增加一个行内标签属性 contentedittable="true",使其变成可以可以输入文字的文本框(也就是让他变成一个焦点元素),他就可以响应表单事件;

1 <div id="wrap" contentedittable="true"></div>
2 <script>
3     var oWrap = document.getElementById("wrap");
4     oWrap.onkeydown = function (){  //当你选中div,按下键盘的时候控制台输出1
5         console.log(1);
6 }
7 <script>

除了上述元素可以获得焦点外,还有一个重要的元素,也就是我们做键盘事件的时候常用的元素,

document,根文档元素,document也可以获得焦点,可以直接对document增加键盘事件,当在当前页的时候(可以理解为选择焦点),按下键盘任意键,键盘事件响应。

1 document.onkeydown = function (){
2   console.log(1);    //按下输出1
3 }

 

posted @ 2018-07-31 10:08  bibiguo  阅读(244)  评论(0)    收藏  举报