Java教程

解除事件绑定的方法

本文主要是介绍解除事件绑定的方法，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！ 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style type="text/css">
        div {
            width:100px;
            height: 100px;
            background-color: #f00;
        }
    </style>
</head>
<body>
    <div id="the-d"></div>
    <script type="text/javascript">
    //解绑定事件的三种方法
    //1  ontType 
    var d=document.querySelector('#the-d'); 

    // d.οnclick=function(){
    //     console.log('我被点击了，clcik');
    //     console.log(this);
    // }

    // d.οnclick=null;


    //2 removeEventListener('type' function)
    // function divClick(){
    //     console.log('我被点击了，click');
    // }

    // function divClick1(){
    //     console.log('我被点击了，click');
    // }

    // function divClick2(){
    //     console.log('我被点击了，click');
    // }

    // d.addEventListener('click',divClick);
    // d.addEventListener('click',divClick1);
    // d.addEventListener('click',divClick2);
   
    // d.removeEventListener('click',divClick);

    //1 removeEventListener 只能删除 addEventListener 加上去
    //2  删除时，必须有函数，如果你不知道函数，Js途径没有办法查询，更无法删除
    //3 作为程序员，怎么能够知道某一个元素挂上了那些事情？
    
    //3 deattachEvent('onType',function)
    function divClick(){
        console.log('被点击了');
    }

    d.attachEvent('onclick',divClick);

    d.detachEvent('onclick',divClick);

    // 练习，按照，addEvent写一个removeEvent，同时要兼容IE和chrome 
    </script>
</body>
</html>
这篇关于解除事件绑定的方法的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航