zoukankan      html  css  js  c++  java
  • 卸载事件off()方法

    卸载事件off()方法

    • 通过.on()绑定的事件处理程序
    • 通过off() 方法移除该绑定

    根据on绑定事件的一些特性,off方法也可以通过相应的传递组合的事件名,名字空间,选择器或处理函数来移除绑定在元素上指定的事件处理函数。当有多个过滤参数时,只有与这些参数完全匹配的事件处理函数才会被移除

    绑定2个事件

    $("elem").on("mousedown mouseup",fn)

    删除一个事件

    $("elem").off("mousedown")

    删除所有事件

    $("elem").off("mousedown mouseup")

    快捷方式删除所有事件,这里不需要传递事件名了,节点上绑定的所有事件讲全部销毁

    $("elem").off()

     下面代码参考off用法即可。。。别人给的例子,写的真是龊

    <!DOCTYPE html>
    <html>
    
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <title></title>
        <style>
        .left div,
        .right div {
            width: 100%;
            height: 50px;
            padding: 5px;
            margin: 5px;
            float: left;
            border: 1px solid #ccc;
        }
        
        .left div {
            background: #bbffaa;
        }
        
        .right div {
            background: yellow;
        }
        </style>
        <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
    </head>
    
    <body>
        <h2>删除事件</h2>
    
    
        <h4>测试一</h4>
        <div class="left">
            on('mousedown mouseup')
            <div class="aaron">点击触发</div>
        </div>
        <button>点击删除mousedown事件</button>
        <script type="text/javascript">
        var n  = 0;
        //绑定事件
        $(".aaron:first").on('mousedown mouseup', function(e) {
            $(this).text( '触发类型:' +  (e.type) + ",次数" + n)
            ++n;
        })
    
        //删除事件
        $("button").click(function() {
            $(".aaron:first").off('mousedown')
        })
       
        </script>
    
    
    
        <h4>测试一</h4>
        <div class="left">
            on('mousedown mouseup')
            <div class="aaron">点击触发</div>
        </div>
        <button>点击销毁所有事件off</button>
        <script type="text/javascript">
        var n  = 0;
        //绑定事件
        $(".aaron:last").on('mousedown mouseup', function(e) {
            $(this).text( '触发类型:' +  (e.type) + ",次数" + n)
            ++n;
        })
    
        //删除事件
        $("button").click(function() {
            $(".aaron:last").off()
        })
       
        </script>
    </body>
    
    </html>
  • 相关阅读:
    腾讯2017校招编程:一个数等于两个素数的和
    人类简史:从动物到上帝
    讨论:研发团队到底应该是制定OKR还是制定KPI?
    绩效主义毁了索尼
    研发团队是该制定OKR还是KPI?
    一切不行,都是“人”的不行?
    能力陷阱:能力越强,越容易失败
    一个好的产品经理到底有多么重要?
    管理:不会把目标翻译成任务,要你何用?
    做一个有产品思维的研发:Scrapy安装
  • 原文地址:https://www.cnblogs.com/zhangmingzhao/p/7496977.html
Copyright © 2011-2022 走看看