jquery的事件

jquery的事件

1.创建事件和删除事件
需求: 点击之后删除打印a事件,不删除打印b事件
分析:删除事件用off("事件类型") 会全部删除这个类型的事件
解决:事件类型命名空间的方法

$("div").on("click.a",function(e){
      console.log("a");
    // console.log(e);
    $(this).off("click.a");//命名空间可以解决删除事件的问题
    // 将所有click事件的内容全部删除
}).on("click.b",function(){
    console.log("b");
}) 

2.事件的传参

• 默认事件类型 三个参数,第二个参数是实际 实参可以是变量,可以是对象等

$("div").on("click",a,function(e){   
      console.log(e);
      console.log(e.data) //就是传进来的参数
}

• 抛发事件 两个参数 (事件类型,回调函数(e,o,f,g,h)) 回调函数中第二个参数后是形参

$("div").on("chilema", function (e, o) {
    console.log(e, o);
})

$("div").trigger("chilema");//抛发事件    不传参
$("div").trigger("chilema", { a: 1, b: 10 });    //传参


//多个参数
$("div").on("chilema",function(e,a,b,c){
    console.log(e,a,b,c);
})
$("div").trigger("chilema",[10,100,1000])




//两种抛发
$("form").on("submit", function (e) {
    console.log(e);
    return "abc"
})

$("form").trigger("submit");//会触发默认事件
$("form").triggerHandler("submit");//这个不会触发默认事件

3.滑过事件 第一个函数是滑过,第二个函数是滑出

$("div").hover(function(){
    $(this).css("backgroundColor","green")   
},function(){
  $(this).css("backgroundColor","red")
})