事件绑定,清除和PC拖拽原理

wenzhongxiang
wenzhongxiang
管理员
304
文章
0
粉丝
JS+JQuery字数 289阅读模式

一 事件绑定【JQ】

在JQ中无论是哪种添加事件的方式,采用的都是绑定的形式,这种操作的好处就是可以同时给一个元素添加多个事件或者多次同名事件。 文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

$( 'div' ).on( {
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

 文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

    "事件名1":处理函数1,
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

    "事件名2":处理函数2
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

    ..........
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

} );
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

 文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

$( 'div' ).on( '事件名',function(){
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

    // 事件处理函数
文章源自小温Talk.听闻 | 小温Talk-https://azureyun.azurewebsites.net/1284.html

} );

二 事件清除

在 JQ 中利用 off() 函数可以清除元素身上的事件

$('div').off( );

01 如果 off 里面没有设置参数那么表示将 div 身上的事件全部清除

02 如果 off 只想清除某一些事件那么可以将相应的事件名称传入,多个事件名称之间用逗号隔开。

三 PC拖拽

实现拖拽的原理就是 鼠标按下的点和鼠标抬起的点相对于被拖拽的物理体来说位置是没有发生改变的,所以可以在鼠标滑动的过程中不停的去设置 div 应该具有的 left top 值。

01 mousedown: 鼠标按下事件( 没有抬起 )

02 mousemove: 鼠标在元素上滑动

  1. ouseup: 鼠标从元素上抬起

 

文章末尾固定信息

 
  • 本文由 wenzhongxiang 发表于11/13/2016 15:59:59
  • 转载请务必保留本文链接:https://azureyun.azurewebsites.net/1284.html