JQuery事件

一.事件绑定

• 方式一

eventName


$("button").click(function(){
    // Code
});

• 方式二

$("button").on("click", function(){
        // Code
});

二.事件解绑

off()

• 如果不传递参数，会移除所有的事件
• 如果传递一个参数，会移除指定类型的事件
• 如果传递两个参数，会移除所有指定类型的指定事件

三.事件冒泡与默认行为

1. 什么是事件冒泡

事件从里传给外

$(".father").click(function(){
        alert("Father");
});

$(".son").click(function(event){
   alert("Son");
});

// 弹出son father

2. 阻止事件冒泡

• 方法一

  return false;
  

• 方法二

  $("button").click(function(event){
    event.stopPropagation();
  });
  

3. 什么是默认行为

比如点击a标签会进入别的网页等等

4. 阻止默认行为

• 方法一

  return false;
  

• 方法二

  $("button").click(function(event){
    event.preventDefault();
  });
  

四.事件的自动触发

• 方式一

  trigger()
  

• 方式二

  triggerHandler()
  

区别

• trigger会触发事件冒泡
• triggerHandler不会触发事件冒泡
• trigger触发默认行为
• triggerHandler不会触发默认行为

$(".father").click(function(){
    alert("Father");
});
$(".son").click(function(event){
    alert("Son");
});

$('.father').trigger('click'); //自动触发事件‘click’
$('.son').triggerHandler('click');

五. 自定义事件

条件

• 事件必须通过on绑定的

• 事件必须通过trigger来触发

$("div").on('myClick', function(){
    alert("Yo!");
});
$("div").trigger("myClick");

六.事件委托

委托的对象.delegate("li","click", function(){//Code})