1.鼠标事件:
click/dbclick/mouseover/mouseout/mouseenter/mouseleave/mousemove/mousedown/mouseup
2.HTML事件:
onload/onunload/onsubmit/onresize/onchange/oninput/onfoucs/onblur/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("你输入的是回车键");
}
}