Jquery的事件绑定方式:
最常用的就是 on(),live(),delegate(),live() bind()---------作用就是在选择到的元素上绑定特定事件类型的监听函数 live()------------------在版本 1.9 中被移除。请使用on()方法代替。 delegate()------------版本号小于1.7on()-------------------版本号大于1.7
1、bind(type,[data],func)
bind是使用频率较高的一种,作用就是在选择到的元素上绑定特定事件类型的监听函数,参数的含义如下: type:事件类型,如click、change、mouseover等; data:传入监听函数的参数,通过event.data取到。可选; function:监听函数,可传入event对象,这里的event是jQuery封装的event对象,与原生的event对象有区别
JavaScript
$(function(){ $('div').bind("click",'olivia',function(){ $('p').slideToggle(); }) }) HTML <body> <div style="width:100px;height:100px;background: #000;"></div> <p>wjlaFL.VJHQFVB.WBV.QBQBJB</p> </body>一个函数绑定多个事件
javascript
$('div').bind('click mouseout dbclick','olivia',function(){ $('p').slideToggle(); }); 单个事件绑定单个函数
$('d iv').bind({'click',function(){ $('p').slideToggle() },'mouseout':function(){ $('h1').slideToggle(); }})
2、live(type, [data], fn)
$('div').live('click',function(){ $('p').css('color','red'); }) 注意:这里是不能使用1.9版本的库的,live()方法在版本 1.9 中被移除。请使用on()方法代替。3、on(type,[selector],[data],fn)
javascript
$("div").on("click",function(){ $('p').css('color','red'); })4、delegate
delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,
举例:当单击 <div> 元素内部的 <p> 元素时,改变所有 <p> 元素的背景颜色:
$('div').delegate('p','click',function(){ $('p').css('color','red'); })