jquery事件的常用方法

作者: 秦小麟 | 来源:发表于2018-04-06 16:42 被阅读21次
    单击按钮 ,按钮消失
    $(document).ready(function(){     
      $("button").click(function(){         
         $(this).hide();       
      });
    });
    
    双击按钮,按钮消失
    $("button").dblclick(function(){
             $(this).hide();
    });
    
    鼠标放上去,按钮消失
    $("button").mouseenter(function(){       
             $(this).hide();
    });
    
    鼠标离开,按钮消失
    $("button").mouseleaver(function(){       
         $(this).hide();
    });
    

    2.绑定事件和解除绑定事

       $(document).ready(function(){
            //$("#clickMeBtn").bind("click",clickHandler1);
            //$("#clickMeBtn").bind("click",clickHandler2);
           // $("#clickMeBtn").unbind("click",clickeHandler1);
    
            $("#clickMeBtn").on("click",clickHandler1);
            $("#clickMeBtn").on("click",clickHandler2);
            $("#clickMeBtn").off("click",clickeHandler1);
        });
    
       function clickHandler(e){
                 console.log("clickHandler1")
      }
      function clickHandler(e){
                 console.log("clickHandler2")
       }
    

    3.事件的目标和事件冒泡

    阻止事件冒泡的API:
    event.stopPropagation() //阻止父级的冒泡事件
    event.stopImmediatePropagation()// 阻止所有的冒泡事件

    5.自定义事件

    var ClickMeBtn;
    $(doucument).ready(function){
          ClickMeBtn = $("#ClickMeBtn");
          ClickMeBtn.click(function(){
                   var e =jQuery.Event("MyEvent");
                   ClickMeBtn.trigger(e);
    });
         ClickMeBtn.bind("MyEvent",function(event)){
                     console.log(event);
    })
    });
    

    相关文章

      网友评论

        本文标题:jquery事件的常用方法

        本文链接:https://www.haomeiwen.com/subject/ecsshftx.html