js off bind unbind delegate undelegate绑定解绑操作,其中off可以解绑任意js事件

 

 

 

 

 

 

 

/*绑定多个事件

$(function(){ 

$("div").delegate("#a,#b",{"click":function(){

alert(1)

}

,"mouseover":function(){

$(this).before(1)

}

})})

$(function(){ 

      $("div").delegate("#a,#b","click mouseover",function(){

   alert(1)

  })

        })

$(document).ready(function(e) {

         $("#a").on({

"click":function(){

alert(1)},"mouseover":function(){alert(2)}

})

      });

 

 

      function un(){ 

    $("div").undelegate("mouseover")

      }

   

    $(document).ready(function(e) {

     $("#a,#b").delegate(this,"click",function(){

  alert(1)

})

    });

 

     //单个解除或多个off

     function un(){ 

   $("#a,#b").off("click")   or $("#a").unbind("click") or $("#a").off("click")$("#a").off("click") 事 off可以解绑delegate bind on等事件

     }

    */

     

/* function test(event){

   alert(event.data.data)

}

     $(document).ready(function(e) {

$("#a").on("click",{data:"1"},test)

     });

 

 

$(function(){

    $("#a").on("自定义事件",function(event,data){

  alert(data)

}) 

  

  $("#a").trigger("自定义事件","231")

     })

 

$(function(){

$("#a").mouseover(function(){

alert(1)

})

})

  function un(){ 

       $("#a").off("mouseover")   

     }*/

 

 

</script>

 

</head>

 

<body>

  <div>

     <span id="a" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;" >1</span> <br/> <br/>

        <span id="b" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;">2</span> <br/> <br/>

          <span id="c" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;">3</span> <br/> <br/>

           </div>

               <input type="button" value="移除事件"  onclick="un()"/>

 


/*绑定多个事件$(function(){ $("div").delegate("#a,#b",{"click":function(){alert(1)},"mouseover":function(){$(this).before(1)}})}) $(function(){       $("div").delegate("#a,#b","click mouseover",function(){   alert(1)  })        })$(document).ready(function(e) {         $("#a").on({"click":function(){alert(1)},"mouseover":function(){alert(2)}})      });       function un(){     $("div").undelegate("mouseover")      }       $(document).ready(function(e) {     $("#a,#b").delegate(this,"click",function(){  alert(1)})    });
     //单个解除或多个off     function un(){    $("#a,#b").off("click")   or $("#a").unbind("click") or $("#a").off("click")$("#a").off("click") 事 off可以解绑delegate bind on等事件     }    */     /* function test(event){   alert(event.data.data) }     $(document).ready(function(e) { $("#a").on("click",{data:"1"},test)     });   $(function(){    $("#a").on("自定义事件",function(event,data){  alert(data)})     $("#a").trigger("自定义事件","231")     })  $(function(){ $("#a").mouseover(function(){ alert(1) }) })  function un(){        $("#a").off("mouseover")        }*/  </script>
</head>
<body>  <div>     <span id="a" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;" >1</span> <br/> <br/>        <span id="b" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;">2</span> <br/> <br/>          <span id="c" style="display:block; width:20px; height:20px; background-color:#F00; color:#0F0; text-align:center;">3</span> <br/> <br/>           </div>               <input type="button" value="移除事件"  onclick="un()"/>

 

posted @ 2019-05-05 10:00  小农_码  阅读(547)  评论(0编辑  收藏  举报