什么是jquery的事件命名空间?

  先看如下简单代码:

 $("#btn").on("click.name1.name2",function(){
console.log(1);
})

  其中name1、name2即为所绑定click事件的命名空间,在这里命名空间在事件名后面用“.”来连接。在这里也可以把命名空间理解为别名,即这里绑定的click事件有两个别名name1和name2。

绑定具有命名空间的事件如何解除绑定?

  如下8种写法均可取消绑定之前绑定的click.name1.name2这一带命名空间的click事件:

  $("#btn").off("click");
$("#btn").off(".name1");
$("#btn").off(".name2");
$("#btn").off(".name1.name2");
$("#btn").off("click.name1");
$("#btn").off("click.name2");
$("#btn").off("click.name1.name2");
$("#btn").off("click.name2.name1");
9 $("#btn").off(".name2.name1");

1会取消绑定所有click事件(包括带任意命名空间的);

2会取消绑定命名空间中包括name1的所有事件(不仅仅click事件);

3会取消绑定命名空间中包括name2的所有事件(不仅仅click事件);

4会取消绑定命名空间中包括name1和name2的所有事件(不仅仅click事件);

5会取消绑定命名空间中包括name1的click事件;

6会取消绑定命名空间中包括name2的click事件;

7、8会取消绑定命名空间中包括name1和name2的click事件(name1和name2两个命名空间是平级的,并不是父级和子级的关系);

9会取消绑定命名空间中包括name1和name2的所有事件(不仅仅click事件);

  综合这几条可以发现命名空间之于jquery事件类似类名之于标签,这样就很好记忆。如果只想解绑不带命名空间的click事件呢?其实很简单:

$("#btn").off("click!");

  解绑时候在事件名后加上“!”即可,这样带有命名空间的事件不会受影响。

PS

  jQuery也可以绑定和解绑自定义事件,而且自定义事件也可以有命名空间。

浅谈jquery事件命名空间的更多相关文章

  1. 浅谈jquery关于select框的取值和赋值

    浅谈jquery关于select框的取值和赋值   jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其 ...

  2. jQuery事件命名空间多事件绑定自定义事件js 命名空间 javascript命名空间

    http://blog.csdn.net/pigpigpig4587/article/details/24727791 jQuery事件命名空间 jQuery支持事件命名空间,以方便事件管理.例如,在 ...

  3. 浅谈jQuery中的Ajax

    浅谈jQuery中的Ajax 一.前言 jQuery 对 Ajax 操作进行了封装, 在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post ...

  4. 车大棒浅谈jQuery源码(二)

    前言 本来只是一个自己学习jQuery笔记的简单分享,没想到获得这么多人赏识.我自己也是傻呵呵的一脸迷茫,感觉到受宠若惊. 不过还是有人向批判我的文章说,这是基本知识点,完全跟jQuery源码沾不上边 ...

  5. jQuery事件命名空间

    先看一些代码: 也可以用bind进行事件绑定.我们看到上面的代码,我们可以在事件后面,以点号,加我们的名字,就是事件命名空间.所谓事件命名空间,就是事件类型后面以点语法附加一个别名,以便引用事件,如& ...

  6. 浅谈jquery之on()绑定事件和off()解除绑定事件

    off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该 ...

  7. 浅谈 jQuery 事件源码定位问题

    该方法已过期,chrome 48还是49开始,自带各种流行框架的事件绑定解析. 勾上这个选项即可. 昨天群里有人问了个事件源码定位的问题,简单描述下是这样的. 在一个不是自己写的页面上,如何快速定位到 ...

  8. 浅谈Jquery中的bind(),live(),delegate(),on()绑定事件方式

    前言 因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能 ...

  9. 浅谈JS事件冒泡

    今天要跟大家谈的是事件冒泡,这个事件呢,也是两面性的,有时候给我们带来bug,有时候优点也很明显.我们就一起来看看它的真面目.  首先看看事件冒泡是什么? 事件冒泡 :当一个元素接收到事件的时候 会把 ...

随机推荐

  1. PAT 1124 Raffle for Weibo Followers

    1124 Raffle for Weibo Followers (20 分)   John got a full mark on PAT. He was so happy that he decide ...

  2. Java Design Pattern(Factory,Singleton,Prototype,Proxy)

    一.Factory 设计模式: the most common pattern,create a new object ,eg. A a=new A();工厂模式的好处:工厂模式可以做到把创建对象单独 ...

  3. Myeclipse和idea对比

    新入的公司要用myeclipse,没办法,只能跟着队伍走.(myeclipse以下简写为me) 1.myeclipse的快捷键并不能设置鼠标滚轮之类的,之前在idea上配置滚轮下滚展开package, ...

  4. C++中的getline

    https://www.cnblogs.com/ymd12103410/p/9514896.html#undefined

  5. PHP基础入门(五)---PHP面向对象实用基础知识

    前言: 今天来和大家介绍一下PHP的面向对象.说到面向对象,我不得不提一下面向过程,因为本人在初学时,常常分不清楚面向对象和面向过程,下面就来给大家介绍一下它们的区别: 面向对象专注于由哪个对象来处理 ...

  6. ACCESS 查询重复记录

    In (SELECT [全称] FROM [New14] As Tmp GROUP BY [全称],[账号],[银行] HAVING Count(*)>1  And [账号] = [New14] ...

  7. Centos 7防火墙firewalld开放端口

    firewall-cmd --zone=/tcp --permanent 出现success表明添加成功 命令含义:--zone #作用域--add-port=80/tcp #添加端口,格式为:端口/ ...

  8. 多线程之 Thread类

    一.多线程第一种方式的实现步骤(继承Thread类) 代码演示: 1.定义MyThread类,继承Thread类 2.重写了里面的run方法,在run方法中定义线程要执行的任务 public clas ...

  9. 高通sdm845_la2.0源码编译及使用QFIL刷机

    一.下载源码 高通芯片代码下载地址:https://chipcode.qti.qualcomm.com/ . *_amss_standard_oem : 高通私有源码(*为sdm845-la--. * ...

  10. mybatis(二)

    一级缓存和二级缓存 mybatis一二级缓存测试实例: package com.atguigu.mybatis.test; import java.io.IOException; import jav ...