欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

DOM之事件(二)

程序员文章站 2022-06-30 11:40:12
今天详细讲解JavaScript中的常用事件类型和功能。 一 鼠标事件 1, click:点击事件 等同于mousedown+mouseup,不管这两个事件间隔多久,都会触发一次click事件。 2, mousedown:鼠标按下事件 3, mouseup:鼠标弹起事件 4, mouseover/m ......

今天详细讲解javascript中的常用事件类型和功能。

 

一    鼠标事件

  1,  click:点击事件

  等同于mousedown+mouseup,不管这两个事件间隔多久,都会触发一次click事件。

  2,  mousedown:鼠标按下事件

  3,  mouseup:鼠标弹起事件

  4,  mouseover/mouseenter:鼠标移入事件

  5,  mouseout/mouseleave:鼠标移出事件

    注意:es5添加的mouseenter和mouseleave阻止了事件冒泡。

  6,  mouseover:鼠标移动事件

  7,  contextmenu:右键出现菜单事件

  小技巧:通过事件对象的button属性可以判断鼠标左右键,0:左键;1滚轮;2,:右键。另外,click事件只能由左键触发,只有mousedown和mouseup可以触发右键点击事件。

 

二    键盘事件

         1,keydown:按键按下事件

    可以检测所有按键,但不会返回字符编码。

         2,keypress:按键按下事件

    只能响应字符类按键,可以返回字符的编码,charcode属性。

         3,keyup:按键弹起事件

 

三    输入框事件

  1,  input

  每输入一次就会触发一次,即只要输入框的内容有变化都会触发该事件。

  2,  change

  聚焦和失去焦点两个时刻内容不同才触发。

  3,  focus,获取焦点

  当输入框获取焦点时触发

  4,  blur,失去焦点

  当输入框失去焦点时触发

 

 


  dom事件处理函数的绑定和使用与click事件基本一致,本篇就不一一举例了。使用时注意他们的特点即可。