jquery基础事件

wfaceboss

发布于 2019-04-08 11:41:01

1.6K0

文章被收录于专栏：wfacebosswfaceboss

一.常用的事件有：click、dblclick、 mousedown、mouseup、mousemove、mouseover、mouseout、change、select、submit、keydown、 keypress、keyup、blur、focus、load、resize、scroll、error。。。。。

二.Query 通过.bind()方法来为元素绑定这些事件。可以传递三个参数：bind(type,[data],fn)：

type 表示一个或多个类型的事件名字符串.

[data]是可选的，作为 event.data 属性值传递一个额外的数据，这个数据是一个字符串、一个数字、一个数组或一个对象.

fn 表示绑定到指定元素的处理函数。

前提：jquery包的引入

准备的html:待续

第一部分：添加绑定事件: bind()

1.匿名函数

//使用点击事件

 $('input').bind('click',function(){ //点击按钮后执行匿名函数

 alert('点击！'); 

});

解释：给元素绑定click事件，函数为function（）{}。

2.普通函数

//普通处理函数

 $('input').bind('click',fn); //执行普通函数式无须圆括号

 function  fn()
{ 

alert('点击！'); 

}

解释：通过有函数名来调用。进一步绑定在事件上。

3.同时绑定多个事件

//可以同时绑定多个事件

$('input').bind('mouseout  mouseover', function(){ //移入和移出分别执行一次 

$('div').html(function(index,value)

{ returnvalue+'1'; }); 

});

4.对象键值对绑定多个参数（函数）

//通过对象键值对绑定多个参数

 $('input').bind({ //传递一个对象

 'mouseout':function(){ //事件名的引号可以省略 

alert('移出'); 

}, 
'mouseover':function()
{
 alert('移入');
 }
 });

第二部分：删除绑定事件:unbind()

1.删除所用当前的元素事件

//使用 unbind 删除绑定的事件

 $('input').unbind();   //删除所有当前元素的事件

2.删除指定的事件

//使用 unbind 参数删除指定类型事件 

$('input').unbind('click'); //删除当前元素的 click 事件

3.删除指定函数

//使用 unbind 参数删除指定处理函数的事件

 function fn1(){ alert('点击 1'); }

 functionfn2(){ alert('点击 2'); }

$('input').bind('click',fn1);

 $('input').bind('click',fn2);

$('input').unbind('click',fn1); //只删除 fn1 处理函数的事件

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2017-01-02 ，如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法