目录
1.窗口事件onblur :失去焦点onfocus:获得焦点onload:窗口加载事件onresize:窗口大小缩放事件
二、表单事件oninput ：当文本框内容改变时 ，立即将改变内容 输出在控制台onchange： 内容改变事件onclick：鼠标单击时触发此事件
三、键盘事件onkeydown：当键盘上的某个按键被按下时触发此事件onkeyup：当键盘上的某个按键被按下后（长按不会触发）按键回弹才会触发此事件onkeypress：按下某个按键后触发（长按也能触发）
四、鼠标事件onclick：鼠标单击时触发此事件ondblclick：鼠标双击时触发此事件onmousedown：鼠标按下时触发此事件（长按触发不了事件）onmouseup：鼠标弹起时触发的事件onmouseover：鼠标移动到某个设置了此事件的元素上时触发此事件onmousemove：鼠标移动时触发此事件onmouseout：鼠标从某个设置了此事件的元素上离开时触发此事件onmousewheel:鼠标的滚轮运行时触发
前言： 我们用到JavaScript的时候js的事件就显得特别重要了
1.窗口事件
窗口事件onblur失去焦点onfocus获得焦点onload窗口加载事件onresize窗口大小缩放事件
onblur :失去焦点
onfocus:获得焦点
/* 当窗口失去焦点时 */
window.onblur = function () {
alert('窗口失去了焦点！');
}
/* 当窗口获得焦点时 */
window.onfocus = function () {
alert('窗口获得了焦点！');
}
onload:窗口加载事件
onresize:窗口大小缩放事件
/* 窗口加载完成后*/
window.onload =function () {
console.log("窗口加载完成！")
}
/* 窗口大小改变时 事件 */
window.onresize = function () {
console.log("窗口大小正在发送生改变");
}
二、表单事件
表单事件oninput当文本框内容改变时 ，立即将改变内容 输出在控制台onchange内容改变事件onclick鼠标单击时触发此事件
oninput ：当文本框内容改变时 ，立即将改变内容 输出在控制台
onchange： 内容改变事件
onclick：鼠标单击时触发此事件
三、键盘事件
键盘事件onkeydown当键盘上的某个按键被按下时触发此事件onkeyup当键盘上的某个按键被按下后（长按不会触发）按键回弹才会触发此事件onkeyup按下某个按键后触发（长按也能触发）
onkeydown：当键盘上的某个按键被按下时触发此事件
// 键盘按下事件，把回车键值输出改为'按下了回车'
window.onkeydown = function (event) {
// 解决兼容问题
event = event || window.event;
console.log("键盘按下了" + event.keyCode);
if (event.keyCode === 13) {
console.log('按下了回车');
}
}
onkeyup：当键盘上的某个按键被按下后（长按不会触发）按键回弹才会触发此事件
/* onkeyup： 当松开按键时 触发 */
window.onkeyup = function (event) {
event = event || window.event;
console.log("键盘按下了" + event.keyCode);
if (event.keyCode === 13) {
console.log('按下了回车');
}
}
onkeypress：按下某个按键后触发（长按也能触发）
/*onkeypress：按下某个按键后触发（长按也能触发）*/
window.onkeypress = function (event) {
event = event || window.event;
console.log("键盘按下了" + event.keyCode);
if (event.keyCode == 13) {
console.log('按下了回车');
}
}
四、鼠标事件
鼠标事件onclick鼠标单击时触发此事件ondblclick鼠标双击时触发此事件onmousedown鼠标按下时触发此事件onmouseup鼠标弹起时触发的事件onmouseover鼠标移动到某个设置了此事件的元素上时触发此事件onmousemove鼠标移动时触发此事件onmouseout鼠标从某个设置了此事件的元素上离开时触发此事件onmousewheel当鼠标的滚轮运行时
onclick：鼠标单击时触发此事件
ondblclick：鼠标双击时触发此事件
onmousedown：鼠标按下时触发此事件（长按触发不了事件）
onmouseup：鼠标弹起时触发的事件
onmouseover：鼠标移动到某个设置了此事件的元素上时触发此事件
/*移动到按钮上面触发*/
onmousemove：鼠标移动时触发此事件
/*在控键范围内移动都能触发*/
onmouseout：鼠标从某个设置了此事件的元素上离开时触发此事件
/*鼠标进入控键元素再移出控键元素触发*/
onmousewheel:鼠标的滚轮运行时触发
window.onmousewheel=function (){
console.log("鼠标的滚轮运行时");
}
总结： 其实JavaScript的事件作用给用户带来了很多便捷，我们也可以更方便的收集到用户的信息，单词虽多，但也有规律
相关链接
发表评论