.off( events [, selector ] [, handler ] )

描述:移除一个事件处理函数

  • events
    类型: String
    一个或多个空格分隔的事件类型和可选的命名空间,或仅仅是命名空间,比如"click", "keydown.myPlugin", 或者 ".myPlugin"。
  • selector
    类型: String
    一个选择器,当绑定事件处理程序时匹配最初传递给 .on()的那个。
  • handler
    类型: FunctionEvent eventObject )
    以前附加的事件处理函数,或特殊值false

     $("body").off("change", "click","#div2 .textbox-text").on("change", "#div2 .textbox-text", function (e) {
    console.log(2) })

      

    off() 方法移除用.on()绑定的事件处理程序。有关详细信息,请参阅该网页上delegated和directly绑定事件。可以通过提供组合的事件名,名字空间,选择器或处理函数来移除绑定在元素上指定的事件处理函数。当有多个过滤参数时,只有与这些参数完全匹配的事件处理函数才会被移除。

    如果一个简单的事件名称,比如提供"click",那么所有 这种类型的事件(包括直接和委派)从元素上被移除。对于写插件,或者基于大型代码而编程时,最好是通过名字空间进行事件绑定或移除操作,这样就不会意外的移除其它代码添加的事件处理函数。在一个特定的命名空间中的所有类型的事件,可以从一个元素中删除,只是提供了一个命名空间,比如 ".myPlugin"。在移除事件处理时,至少要提供名字空间或事件名。

    要删除特定的委派事件处理程序,需要提供一个selector 的参数。该选择器字符串必须与之前通过 .on() 进行事件处理绑定时使用的选择器相一致。若要移除元素上所有的代理事件,而不移除任何非代理事件,请使用特殊值 "**"。

    处理程序也可以删除handler参数指定名称的函数。当jQuery的绑定一个事件处理程序,它分配一个唯一的ID给处理函数。函数用jQuery.proxy()代理或类似有相同的唯一ID机制(代理函数),因此,通过代理处理程序.off 可能会删除比预期更多的处理程序。在这些情况下,最好是附加和移除事件处理程序,使用命名空间。

    .on()一样,你可以传递一个 events参数明确的指定而不是用events 和 handler作为单独参数。键是事件类型及可选的名字空间,值是绑定的处理函数,或者是特殊值false

    例子:

    Example: 为有颜色的按钮添加并移除事件处理。

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    button { margin:5px; }
    button#theone { color:red; background:yellow; }
    </style>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    </head>
    <body>
    <button id="theone">Does nothing...</button>
    <button id="bind">Add Click</button>
    <button id="unbind">Remove Click</button>
    <div style="display:none;">Click!</div>
    <script>
    function aClick() {
    $("div").show().fadeOut("slow");
    }
    $("#bind").click(function () {
    $("body").on("click", "#theone", aClick)
    .find("#theone").text("Can Click!");
    });
    $("#unbind").click(function () {
    $("body").off("click", "#theone", aClick)
    .find("#theone").text("Does nothing...");
    });
    </script> </body>
    </html>

      

    Example: 移除所有段落上的事件:

    $("p").off()
    

      

    Example: R移除所有段落上的代理事件:

    var foo = function () {
    // code to handle some kind of event
    }; // ... now foo will be called when paragraphs are clicked ...
    $("body").on("click", "p", foo); // ... foo will no longer be called.
    $("body").off("click", "p", foo);

      

    Example: 通过传入的第三个参数,仅移除先前绑定的事件处理函数:

    var foo = function () {
    // code to handle some kind of event
    };
     
    // ... now foo will be called when paragraphs are clicked ...
    $("body").on("click", "p", foo);
     
    // ... foo will no longer be called.
    $("body").off("click", "p", foo);

      

    Example: 通过指定名字空间,解除绑定表单上所有的代理事件:

    var validate = function () {
    // code to validate form entries
    }; // delegate events under the ".validator" namespace
    $("form").on("click.validator", "button", validate); $("form").on("keypress.validator", "input[type='text']", validate); // remove event handlers in the ".validator" namespace $("form").off(".validator");

      

jq的.off解绑事件的更多相关文章

  1. 【JQ】jq动态绑定事件.on()、解绑事件off()

    #JQ 绑定与解绑事件的方法的历史演变 1. jquery1.4 及之前的版本,由.click() 或 .bind()方法绑定的事件,不能适用脚本创建的新元素:即是说页面加载完成后,再动态创建的DOM ...

  2. 从零开始学 Web 之 DOM(六)为元素绑定与解绑事件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... +-------------------------------------------------------- ...

  3. 从零开始学 Web 之 jQuery(六)为元素绑定多个相同事件,解绑事件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  4. 5月23日笔记-js绑定事件、解绑事件、复合事件

    each() $("p").each(function(i,ele){ //alert(ele.innerHTML); alert($("p:eq("+i+&q ...

  5. JS---DOM---为元素解绑事件

    解绑事件 注意:用什么方式绑定事件, 就应该用对应的方式解绑事件 1.解绑事件 对象.on事件名字=事件处理函数--->绑定事件 对象.on事件名字=null;   //1 对象.on事件名字= ...

  6. jQuery事件之解绑事件

    语法: $(selector).unbind([eventType][,handler(eventObject)]); 返回值:jQuery 参数解释: eventTypey:类型:String以后包 ...

  7. bind() unbind()绑定解绑事件

    .bind( eventType [, eventData], handler(eventObject)) 本文实例分析了JQuery中Bind()事件用法.分享给大家供大家参考.具体分析如下: .B ...

  8. jquery绑定事件,解绑事件

    unbind([type],[data]) 是 bind()的反向操作,从每一个匹配的元素中删除绑定的事件.如果没有参数,则删除所有绑定的事件.你可以将你用bind()注册的自定义事件取消绑定.如果提 ...

  9. window.onresize绑定事件以及解绑事件

    问题描述 在Vue工程中,添加样式,部分需要做到自适应,需要添加resize事件,由于是单页面应用,如果组件初始化的时候绑定事件,在切换页面的时候不去注销事件,如果来回切换,会让resize事件执行多 ...

随机推荐

  1. Thinkphp5.0实战开发二------自动生成目录结构

    序言 ThinkPHP5.0 具备自动创建功能,可以用来自动生成需要的模块及目录结构和文件等,自动生成主要调用\think\Build 类库.ThinkPHP5.0中模块文件夹在application ...

  2. Spring Boot 上传图片文件

    步骤一:基于前面springboot入门小demo 基于的springboot入门小demo,已包含了前面文章的知识点(比如:热部署.全局异常处理器). 步骤二:创建uploadPage.jsp上传页 ...

  3. intellij idea rearrange code

        reformat code的时候,无法将filed放在method前边,很恶心. 那么先去

  4. System.IO命名空间下常用的类

    System.IO System.IO.Directory 目录 System.IO.Path 文件路径(包含目录和文件名) System.IO.FileInfo 提供创建.复制.删除.移动和打开文件 ...

  5. Stm32F103面向对象编程之GPIO

    STM32F103 GPIO面向对象变成实例 创建一个GPIO对象 GpioClass gStateLed = NEW_GPIO(C, 0, GPIO_Mode_Out_PP); 初始化对象 Gpio ...

  6. 【cs231n】反向传播笔记

    前言 首先声明,以下内容绝大部分转自知乎智能单元,他们将官方学习笔记进行了很专业的翻译,在此我会直接copy他们翻译的笔记,有些地方会用红字写自己的笔记,本文只是作为自己的学习笔记.本文内容官网链接: ...

  7. 从0开始 图论学习 邻接表 STL vector

    邻接表表示 用vector实现 writer:pprp 代码如下: #include <bits/stdc++.h> using namespace std; const int maxn ...

  8. TSP - 状态压缩dp

    2017-08-11 21:10:21 艾教写的 #include<iostream> #include<cstdio> #include<cstring> #in ...

  9. nodejs 备忘

    引入模块(在于你用什么模块,需要的模块可以用终端进行安装, npm,一般express,swig,body-parser,cookies,markdown) 设置模块 设置渲染 var express ...

  10. linux ps 命令参数详解

    -a 显示所有终端机下执行的进程,除了阶段作业领导者之外. a 显示现行终端机下的所有进程,包括其他用户的进程. -A 显示所有进程. -c 显示CLS和PRI栏位. c 列出进程时,显示每个进程真正 ...