jQuery鼠标事件、键盘事件、浏览器事件

 鼠标事件

1、.click( ): 点击事件

html文档



	
		
		
		
	
	
		

haha 1

haha 2

haha 3

haha 4

两种写法实现的是相同的功能,只选择其一即可
1、原生js写法

 

2、jQuery写法

 

 效果图

jQuery鼠标事件、键盘事件、浏览器事件_第1张图片

2、.dblclick():双击事件

将click改成dblclick

 

jQuery鼠标事件、键盘事件、浏览器事件_第2张图片

3、.hover ():鼠标停和离开

 

4、.mousedown( ):鼠标按下

5、.mouseenter( ):鼠标进入元素

6、.mouseleave():鼠标离开元素

7、.mousemove( ):鼠标在元素内移动

8、.mouseout( ): 鼠标离开元素(支持事件冒泡)

9、.mouseover( ):鼠标进入元素内(支持事件冒泡 )

10、.mouseup( ):鼠标按键被释放

常用键盘按键对应代码

Backspace <--------> 8

Tab<-------->9

Clear <--------> 12

Enter<-------->13

Shift <-------->16

Control<-------->17

Alt <-------->18

Caps Lock <--------> 20

ESC <--------> 27

空格键 <--------> 32

键盘事件

1、.keydown()

在键盘按下时被触发,但是该事件只能发送在具有焦点的元素上,所以表单元素较为适用。

2、.keypress()

在敲击键盘时被触发,可以理解为按下并抬起同一个键。

3、.keyup()

在按键释放时被触发,也就是按下并抬起同一个键。

这三个事件都被注册时,先触发keydown(),再被触发keypress(),只有当前两者都没有被注册的情况下,才会注册keyup()



	
		
		
		
	
	
		
	

jQuery鼠标事件、键盘事件、浏览器事件_第3张图片

jQuery鼠标事件、键盘事件、浏览器事件_第4张图片

 注释掉前面两个事件后jQuery鼠标事件、键盘事件、浏览器事件_第5张图片

jQuery鼠标事件、键盘事件、浏览器事件_第6张图片

浏览器事件

1、.error()错误事件   被弃用了



	
		
		
		
	
	
		
		
	

2、.resize()页面重置

当页面大小被改变时,会被触发

改变页面大小是给我们的顶级Windows绑定



	
		
		
		
		
	
	
		
啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

jQuery鼠标事件、键盘事件、浏览器事件_第7张图片

作用:我们可以知道不同的页面大小,页面布局以及初始化操作等

可以利用这个事件将这些不同都加载到这个事件中。

3、.scroll ( )滚动事件



	
		
		
		
		
	
	
		

hahaha

jQuery鼠标事件、键盘事件、浏览器事件_第8张图片

 可以给Windows绑定,同时也可以给元素div绑定



	
		
		
		
		
	
	
		
啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

jQuery鼠标事件、键盘事件、浏览器事件_第9张图片

你可能感兴趣的:(jQuery,jquery,计算机外设,前端)