JavaScript 事件入门知识(2)

(7).mousemove:当鼠标指针在元素上移动时触发;
    input.onmousemove = function(){
        alert('Lee');
    }

2.键盘事件

(1).keydown:当用户按下键盘上任意键触发,如果按住不放,会重复触发;
    onkeydown = function(){
        alert('Lee');
    }

(2).keypress:当用户按下键盘上的字符键触发,如果按住不放,会重复触发;
    onkeypress = function(){
        alert('Lee');
    }

(3).keyup:当用户释放键盘上的键触发;
    onkeyup = function(){
        alert('Lee');
    }

3.HTML事件

(1).load:当页面完全加载后(包括所有图像/JavaScript文件/CSS文件等外部资源),就会触发window上面的load事件;
window.onload = function(){
alert('Lee');
}

// 图像上面也可以触发load事件,无论是在DOM中的图像元素还是HTML中的图像元素;
// 因此可以在HTML中为任何图像指定onload事件处理程序;
<img src='https://www.jb51.net/smile.client.gif' >
// PS:新图像元素不一定是从添加到文档后才开始下载,只要设置src属性就会开始下载;

// <script>元素也会触发load事件,以便开发人员确定动态加载的JavaScript文件是否加载完毕;
// 与图像不同,只有在设置了<script>元素的src属性并将该元素添加到文档后,才会开始下载JavaScript文件;

(2).unload:当文档被完全卸载后触发;
 // 只要用户从一个页面切换到另一个页面,就会发生unload事件;
 // 而利用这个事件最多的情况是清除引用,以避免内存泄漏;
     window.onunload = function(){
         alert('Lee');
     }
(3).select:当用户选择文本框(input或textarea)内容改变且失去焦点后触发;
     input.onselect = function(){
         alert('Lee');
     }
(4).change:当文本框(input或textarea)内容改变且失去焦点后触发;
     input.onchange = function(){
         alert('Lee');
     }
(5).focus:当页面或元素获得焦点时在window及相关元素上面触发;这个事件不会冒泡;
     input.onfocus = function(){
         alert('Lee');
     }
(6).blur:当页面或元素失去焦点时在window及相关元素上触发;这个事件不会冒泡;
     input.onblur = function(){
         alert('Lee');
     }
(7).submit:当用户点击提交按钮在<form>元素上触发;
     form.onsubmit = function(){
         alert('Lee');
     }

(8).reset:当用户点击重置按钮在<form>元素上触发;
    form.onreset = function(){
        alert('Lee');
    }

(9).resize:当浏览器窗口被调整到一个新的高度或宽度时,就会触发resize事件;

// 这个事件在window(窗口)上触发;浏览器窗口最大化或最小化也会触发resize事件;
// IE/Safari/Chrome和Opera会在浏览器变化时不断触发resize事件;
// Firefox则只会在用户停止调整窗口大小时才会触发resize事件;
    window.onresize = function(){
        alert('Lee');
    }

(10).scroll:当用户滚动滚动条的元素使触发;
    window.onscroll = function(){
        alert('Lee');
    }