jQuery的事件绑定

xiaoxiao2021-02-27  163

Jquery的事件绑定方式:

最常用的就是 on(),live(),delegate(),live() bind()---------作用就是在选择到的元素上绑定特定事件类型的监听函数       live()------------------在版本 1.9 中被移除。请使用on()方法代替。     delegate()------------版本号小于1.7

on()-------------------版本号大于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'); })

转载请注明原文地址: https://www.6miu.com/read-12298.html

最新回复(0)