为何点第二个button不会出发第一个div的off('mousedown')-慕课网

首页课程实战体系课手记专栏慕课教程

为何点第二个button不会出发第一个div的off('mousedown')

来源：5-3 卸载事件off()方法

C0EEC3F7BBAA

2016-08-05 17:57

两个都是绑定的button，点第一个可以触发第二个div的off()删除全部事件

那点第二个button为什么触发不了第一个的off("mousedown")呢

写回答关注

5回答

C0EEC3F7BBAA: 2016-08-26 17:51:37

前两位朋友 ··· 你们和我看的代码不一样嘛··我的没动过的代码是这样的··只有一个script

<!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>

1 0

C0EEC3...

看错了··确实有两个script···但是第一个script加载时候还没有第二个button··但第一个script里的卸载确能把第二个button事件全卸载了第二个script加载时已经有第一个button了··但第二个script里的卸载off()却不能卸载第一个button里的

2016-08-26 18:00:28

共 1 条回复 >

交替的黑白键

2016-08-24 19:43:01

第一个script结构体加载的时候只有一个button，所以第一个script里面的事件绑定只给了第一个button；第二个script结构体加载的时候已经有了两个button，所以第二个script结构体里面的事件绑定给了两个button；因此第一个button绑定了两个click事件，第二个button只绑定了一个click事件；

0 4
happy_ye16

2016-08-22 10:00:10

因为这两个btn的事件放在2个script结构体里面，前面的对后面有影响，后面的对前面没有影响。
我测试了一下，当把两段script代码放在一个结构体里面时，两个btn的随便点击哪一个，效果都是一样的，互相影响。

0 1
铃铛3

2016-08-11 15:06:31

同问是什么原理顺序的问题吗

0 0
宝宝周

2016-08-05 18:10:38

$("button").click(function() {
$(".aaron:last").off()
})
//一共两个div，指定解绑**class为“aaron”的最后一个元素**的全部事件，不卸载第一个元素的事件

2 0

C0EEC3...

你看下代码，是$('button')绑定的两个button按钮，而不是$('button:first')和$('button:last')这样分着绑定的、所以不是应该随便点哪个button都触发第一个div的off('mousedown')和第二个div的off()嘛

2016-08-05 18:23:40

共 2 条回复 >