原生js之事件解绑

removeEventListener

html

    <button id='btn'>click</button>

js

第一种方式（错误方式）

    var btn = document.getElementById("btn");
    //绑定事件
    btn.addEventListener('click', function () {
        console.log('click btn')
    })
    //解除绑定，调试发现不可用
    btn.removeEventListener('click', function () {
        console.log('remove')
    })

第二种方式（正确方式）

    var btn = document.getElementById("btn");
    function btnHandler() {
        console.log('click btn')
    }
    //绑定事件
    btn.addEventListener('click', btnHandler)
    //解除绑定(可以成功，第一种不成功是因为回调是两个不同的函数，指向了不同的内存，第二种把回调定义到外面，两次的回调是同一个函数)
    btn.removeEventListener('click', btnHandler)