jQuery得事件绑定

1、 绑定事件

语法

bind(type,data,fn)

描述:为每一个匹配元素得特定事件绑定一个事件处理器函数。

参数解释:

type:事件类型

data:作为event.data属性值传递给事件对象得额外数据对象

fn: 绑定到每个元素的事件上面的处理函数

当每个p标签被点击的时候,弹出其文本

$("p").bind("click", function(){
  alert( $(this).text() );
});

你可以在事件处理之前传递一些附加的数据。

function handler(event) {
//event.data 可以获取bind()方法的第二个参数的数据
  alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler)

通过返回false来取消默认的行为并阻止事件起泡。

$("form").bind("submit", function() { return false; })

通过使用 preventDefault() 方法只取消默认的行为。

$("form").bind("submit", function(event){
  event.preventDefault();
});

2、解绑事件

语法:

unbind(type,fn);

描述:

bind()的反向操作,从每一个匹配的元素中删除绑定的事件。

如果没有参数,则删除所有绑定的事件。

如果把在绑定时传递的处理函数作为第二个参数,则只有这个特定的事件处理函数会被删除。

参数解释:

type (String) : (可选) 事件类型

fn(Function) : (可选) 要从每个匹配元素的事件中反绑定的事件处理函数

示例:

把所有段落的所有事件取消绑定

$("p").unbind()

将段落的click事件取消绑定

$("p").unbind( "click" )

删除特定函数的绑定,将函数作为第二个参数传入

var foo = function () {
  //绑定事件和解绑事件的事件处理函数
};

$("p").bind("click mouseenter", foo); // 给p段落绑定click mouseenter事件

$("p").unbind("click", foo); // 只解绑了p段落标签的click事件

3.自定义事件

其实事件的绑定和解绑,都是我为了自定义事件做准备(大家把jQuery的提供的事件熟记在心),以后对jquery熟了以后,可以玩一下自定义事件

语法:

trigger(type,data);

描述:在每一个匹配的元素上触发某类事件,它触发的是由bind()注册的自定义事件。

参数解释:

type (String) : 要触发的事件类型

data (Array) : (可选)传递给事件处理函数的附加参数

示例:

给一个按钮添加自定义的事件

$(‘button‘).bind(‘myClick‘,function(ev,a,b){
    //给button按钮添加的自定义事件myClick事件
})
            

然后通过trigger()触发自定义的事件

$(‘button‘).trigger(‘myClick‘,[1,2])        

4.补充 一次性事件

语法:

one(type,data,fn)

描述:

为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数。在每个对象上,这个事件处理函数只会被执行一次。其他规则与bind()函数相同

参数解释:

type (String) : 事件类型

data (Object) : (可选) 作为event.data属性值传递给事件对象的额外数据对象

fn (Function) : 绑定到每个匹配元素的事件上面的处理函数

示例:
当所有段落被第一次点击的时候,显示所有其文本。

$("p").one("click", function(){
//只有第一次点击的时候才会触发,再次点击不会触发了
  alert( $(this).text() );
});

原文地址:https://www.cnblogs.com/wanrong/p/9517658.html

时间: 2024-08-27 00:41:49

jQuery得事件绑定的相关文章

Jquery之事件绑定(bind(),live(),delegate(),on())

1..bind() 描述: 为一个元素绑定一个事件处理程序. .bind()一个基本的用法: $(selector).bind('click', function() { alert('User clicked on "foo."'); }); 可以直接用原生js替代为: $(selector).click( function() { alert('User clicked on "foo."'); }); 在jQuery1.4.3,您现在可以通过传递false代替

jquery 动态事件绑定(0512)

jquery动态事件绑定,父元素需为静态元素,(不能是动态生成): $("#parent").on("click","#child",function(){ //.... });

对jQuery的事件绑定的一些思考

jQuery的事件绑定 问题 首先我们看下面的一个很常见的事件绑定代码: //example $('#dom').click(function(e){ //do something }); $('#dom2').click(function(e){ //do something }); 这段代码在事件绑定处理上有一些缺陷: 过多的事件绑定会损耗内存 后期生成HTML会没有事件绑定,需要重新绑定 语法过于繁杂 解决方案 对于1.2两点的解决方案,我们首先先了解一下jQuery的事件绑定 jQuer

jQuery中事件绑定

一.前言 最近在做项目中要用到jQuery来绑定事件,首先想到的是$(selector).事件名();这样绑定事件的方式,这种方式对事件进行绑定其实也就是bind()方法,但当选择器匹配的元素过多,$(selector).事件名();对每个元素进行迭代绑定,会影响性能.除了这种方式可以绑定事件以外,还有live()(已过期).delegate().on()方法绑定事件,接下来分析一下它们的区别,以及使用哪种方式最值得推荐.由于live()方法已过期,只分析另外三种,欢迎拍砖.吐槽~~~ 二.用法

了解JQuery的事件绑定特性和事件命名空间机制,编写更好、更灵活的事件处理代码

JQuery中的bind()和unbind(),提供了事件的绑定和取消机制,既可以绑定html默认支持的事件,也能够绑定自定义的事件.JQuery支持自定义事件,这显然给编程带来了极大的灵活性.下面就一起学习下,jquery事件处理的一些特性. 1.JQuery中事件可以重复绑定,不会覆盖. $("#button1").bind("click",function(){ alert("func1"); }); $("#button1&qu

jquery的事件绑定

jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都有哪些. jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off. bind(type,[data],function(eventObject)) bind是使用

!!!jQuery中事件绑定 推荐使用.delegate()或者live()

jQuery中的.bind()..live()和.delegate()之间区别分析 参考:http://www.jb51.net/article/27309.htm DOM树   首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的HTML页面看起来就像是这个样子 事件冒泡(又称事件传播) 当我们点击一个链接时,其触发了链接元素的单击事件,该事件则引发任何我们已绑定到该元素的单击事件上的函数的执行. 复制代码代码如下: $('a').bind('click',function(){al

jQuery的事件绑定和解绑

1.绑定事件 $('获取的标签对象').bind('要操作的方法,  {操作的内容  是字典的形式},function(){} ') 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data (Object) : (可选) 作为event.data属性值传递给事件对象的额外数据对象 fn ( Function) : 绑定到每个匹配元素的事件上面的处理函数 示例: 当每个p

jQuery的事件绑定类型

1..bind() 在.bind()绑定事件的时候,这些元素必须已经存在. 2.on()首选的,最灵活的 3.one()为元素的事件添加处理函数.处理函数在每个元素上每种事件类型最多执行一次. 4..delegate() undelegate是用来移除使用.delegate()的方式已经绑定的事件处理程序