JS事件分类

2021-05-02 05:27

阅读:362

1.鼠标事件:

click/dbclick/mouseover/mouseout

2.HTML事件:

 onload/onunload/onsubmit/onresize/onchange/onfoucs/onscroll

3.键盘事件:

 keydown:键盘按下时触发
 keypress:键盘按下并抬起的瞬间触发。
 keyup:键盘抬起触发

[注意事项]

①执行顺序:keydown keypress keyup
②keypress只能捕获数字,字母,符号键,而不能捕获功能键。
③长按时循环执行keydown--keypress
④有keydown,并不一定有keyup,当长按时焦点失去,将不再触发keyup
⑤keypress区分大小写,keydown,kewup不区分。

4.事件因子:

当触发一个事件时,该事件将向事件所调用的函数中,默认传入一个参数,

这个参数就是一个事件因子,包含了该事件的各种详细信息。

document.onkeydown=function(e){
 console.log(e);
 }
document.onkeydown=function(){
console.log(window.event);
}
 
//兼容浏览器的写法:
document.onkeydown=function(e){
e==e||Window.event;
var Code=e.keyCode||e.which||e.charCode;
if(code==13){
//回车
}
}
 

5.如何确定键盘按键?

①再出发的函数中,接收事件因子e。
②可以使用e.key直接去到按下的按键字符(不推荐使用)。
③一次可以使用keyCode/which/charCode取到按键的ASCII码值。

(兼容各种浏览器的写法)

 

var Code=e.keyCode||e.which||e.charCode;
 
//判断组合键
var isAlt=0,isEnt=0;
document.onkeyup=function(e){
if(e.keyCode==18){
isAlt=1;
}     
if(e.keyCode==13){
isEnt=1;
}   
if(isAlt==1&&isEnt==1){
alert("同时按下Alt和Enter键");
}
}
 
document.onkeyup=function(){
console.log("keyup");
}
document.onkeypress=function(){
console.log("keypress");
}
document.onkeydown=function(){
console.log("keydown");
}
document.onkeypress=function(){
console.log(window.event);
}
//判断是否按下了回车键
document.onkeydown=function(e){
var code=e.keyCode;
if(code==13){
alert("你输入的是回车键");
}
}


评论


亲,登录后才可以留言!