js学习笔记- 20 / 21- js事件 (实例:小方块的拖拽)

1.


注:只要是 IE 9 以下不兼容, 基本上都是W3C标准的

---------------------------------------------------------------------------------------


2.



---------------------------------------------------------------------------------------

3.




匿名函数无法消除:


函数写在外部:


-----------------------------------------------------------------------------------------------------------


4.



冒泡:

    


捕获:

    


冒泡 和 捕获 (先捕获 后 冒泡):





取消冒泡:




封装冒泡函数 stopBubble



阻止默认事件:



阻止默认的右键出菜单事件:

右键出菜单:oncontextmenu



封装阻止默认时间函数:



a标签默认事件:


-----------------------------------------------------------------------------------------------------------

5.事件对象







利用事件委托,优化代码(优点不用循环,新增子元素时,不用重新循环):



target  与  currentTarget区别




-----------------------------------------------------------------------------------------------------------

6.事件分类

 


-----------------------------------------------------------------------------------------------------------

7.小方块的拖拽


-----------------------------------------------------------------------------------------------------------

5.事件对象

只有mosueup mousedown 能识别鼠标的左右键(button: 0(左键) 、 1(滚动轮)、2(右键))



DOM3标准规定,click只能监听鼠标的左键,不能监听右键。


根据mousedown 、mouseup时间间隔,区分拖拽 与 点击



6. 移动端 touchstart  touchmove touchend 对应pc端的  mousedowm  mousemove  mouseup

7. onkeydown  =>  onkeypress  => onkeyup



keydown 能监听 除了 fn 以外,所有的按钮



8. 文本操作事件




猜你喜欢

转载自blog.csdn.net/qq_25131799/article/details/80362354
今日推荐