jquery事件的常用方法

简介: 单击按钮 ,按钮消失$(document).ready(function(){ $("button").click(function(){ $(this).
单击按钮 ,按钮消失
$(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);
})
});
目录
相关文章
|
18天前
|
JavaScript CDN
jQuery方法小记
jQuery方法小记
20 0
N..
|
2月前
|
JavaScript 前端开发
jQuery事件处理
jQuery事件处理
N..
13 1
|
2月前
|
JavaScript
jquery动画与事件案例
jquery动画与事件案例
12 0
|
2月前
|
JavaScript 前端开发 索引
JQuery样式操作、click事件以及索引值-选项卡应用示例
JQuery样式操作、click事件以及索引值-选项卡应用示例
23 1
|
4月前
|
JavaScript
jQuery追加节点方法 和height方法与width方法
jQuery追加节点方法 和height方法与width方法
|
4月前
|
JavaScript 前端开发
调用jQuery的animate()方法无法移动的问题
调用jQuery的animate()方法无法移动的问题
|
1月前
|
JavaScript Serverless
jquery attr()方法
jquery attr()方法
15 0
|
1天前
|
JavaScript
jquery获取子元素的一些方法
jquery获取子元素的一些方法
6 0
|
4天前
|
JavaScript 前端开发 API
jquery的一些方法
jquery的一些方法
7 1
|
7天前
|
JavaScript 前端开发 C++
【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?
【5月更文挑战第2天】【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同?